在jQuery中更改img src [英] Changing img src in jQuery
本文介绍了在jQuery中更改img src的处理方法,对大家解决问题具有一定的参考价值,需要的朋友们下面随着小编来一起学习吧!
问题描述
我希望在用户向下滚动页面后更改图像(图像大小相同,但颜色不同):
I want an image to change once a user has scrolled down the page (the image is the same size, but different color):
HTML
<ul class="social-media-nav-center">
<li>
<a href="https://twitter.com/" target="_blank"><img id="twitter" class="small" src="path/to/image-icon.png" />
</a>
</li>
</ul>
jQuery
$(document).ready(function(){
$(window).scroll(function(){
if($(window).scrollTop() > $(window).height()) {
$("#twitter").attr("src", "../path/to/image-color-icon.png");
}
})
})
当我向下滚动页面时,图像无法识别,只是出现在问号上.
When I scroll down the page, the image is not recognizable, it just comes up as a question mark.
注意
图像路径有效,请相信我.
The image paths are valid, trust me.
-
我觉得这是一个非常简单的解决方法,有什么想法吗?
I feel it's a really simple fix, any ideas?
推荐答案
选中
HTML
<ul class="social-media-nav-center">
<li>
<a href="https://twitter.com/" target="_blank"><img id="twitter" class="small" src="https://encrypted-tbn2.gstatic.com/images?q=tbn:ANd9GcRgdlWvqZIB0r6qkjFS_t9uMKD9gQIVMV3fE-Vw9BMoRfNEmJG2" />
</a>
</li>
</ul>
Jquqey
$(document).ready(function(){
$(window).scroll(function(){
if($(window).scrollTop() > $(window).height()) {
$("#twitter").attr("src", "http://www.planwallpaper.com/static/images/744081-background-wallpaper.jpg");
}
})
})
CSS
.social-media-nav-center{height:1000px;}
https://jsfiddle.net/yakcbanL/
这篇关于在jQuery中更改img src的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!
查看全文