Question

我有这个设置，当我的鼠标悬停在另一张照片上时。出于某种原因，bootply http://www.bootply.com/HoZBYvFSpx并未使用它，但无论如何这里是代码。
当我运行它时，它运行得很慢，当我滚动它时，它会减慢整个浏览器的速度。有没有其他方法可以做到这一点，而不会让我的浏览器陷入困境？

Answer 1

问题是你的照片是4752x3168px，那太大了，请把它们减少到最大1600px。第二，如果你想要更多的速度来加快你的页面速度，那就让css改变图片

这是工作小提琴 http://jsfiddle.net/DRRnu/

另外，如果你想要你可以为这些图像制作一些Jquery预加载器 http://jsfiddle.net/DHMQM/29/

<div id="container"> 
<ul id="gallery" class="clearfix"> 
<li><p><a href="#"><img src="http://nettuts.s3.amazonaws.com/860_preloaderPlugin/images/1.jpg" /></a></p></li> 
<li><p><a href="#"><img src="http://nettuts.s3.amazonaws.com/860_preloaderPlugin/images/2.jpg" /></a></p> </li> 
<li><p><a href="#"><img src="http://nettuts.s3.amazonaws.com/860_preloaderPlugin/images/3.jpg" /></a></p> </li> 
<li><p><a href="#"><img src="http://nettuts.s3.amazonaws.com/860_preloaderPlugin/images/4.jpg" /></a></p></li> 
</ul> 
</div>

鼠标悬停时替换图像

1 个答案: