JS如何控制背景淡入淡出？
2 回答
泛舟湖上清波郎朗
TA贡献1818条经验 获得超3个赞
下代码可以实现，不过你要首先下载一个JS插件：Jquery，我用的是jquery-1.9.1.min.js，你下载下来后放到网页同级目录就可以了，如入代码适用于2张或多张图片。
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 | <div id="imgbox"> <img src="11.jpg" /><img src="22.jpg" /> </div> <script src="jquery-1.9.1.min.js"></script> <script> $(document).ready(function(){ $("#imgbox img").fadeOut(0).eq(0).fadeIn(0); var i = 0; setInterval(function(){ if($("#imgbox img").length > (i+1)){ $("#imgbox img").eq(i).fadeOut(0).next("img").fadeIn(1000); i++; } else{ $("#imgbox img").eq(i).fadeOut(0).siblings("img").eq(0).fadeIn(1000); i = 0; } },2000); }); </script> |
潇潇雨雨
TA贡献1833条经验 获得超4个赞
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 | <html> <head> <style> html,body{width:100%;height:100%;margin:0px auto;padding:0px auto;} .bgdiv{width:100%;height:100%;position:absolute;z-index:-999;} .bgdiv img{width:100%;height:100%;border:0px;} </style> <script src="jquery-1.9.1.min.js"></script> <script> $(document).ready(function(){ $("#imgbox img").fadeOut(0).eq(0).fadeIn(0); var i = 0; setInterval(function(){ if($("#imgbox img").length > (i+1)){ $("#imgbox img").eq(i).fadeOut(0).next("img").fadeIn(1000); i++; } else{ $("#imgbox img").eq(i).fadeOut(0).siblings("img").eq(0).fadeIn(1000); i = 0; } },2000); }); </script> </head> <body> <div id="imgbox" class="bgdiv"> <img src="11.jpg" /><img src="22.jpg" /> </div> <div>网页其他内21容网页其他3内23网页其他内1容312网页其他内容11</div> </body> </html> |
- 2 回答
- 0 关注
- 524 浏览
添加回答
举报
0/150
提交
取消