不多说了,先给大家展示效果图,本文支持源码下载哦,需要的朋友可以直接下载使用,代码很简单哦~
在线预览 源码下载html代码:<a href="#">换肤</a><p class="heitiao"></p><p class="con"><img src="images/content.png" /></p><p class="head"><p class="menu"><p class="title"> <p class="p1"></p> <p class="p2"></p></p><p class="bg"><p class="bgcon"><img class="big" src="images/bg0s.jpg"><img src="images/bg1s.jpg"><img src="images/bg2s.jpg"><img src="images/bg3s.jpg"><img src="images/bg4s.jpg"><img src="images/bg5s.jpg"><img class="big" src="images/bg6s.jpg"><img src="images/bg7s.jpg"><img src="images/bg8s.jpg"><img class="last" src="images/bg9s.jpg"><img class="last" src="images/bg10s.jpg"><img class="last" src="images/bg11s.jpg"></p><p class="bgyl"> <img src="images/yl.png"></p></p></p></p><script type="text/javascript" src="js/jquery.js"></script><script type="text/javascript"> var i=1; $("a").click(function(){ $(".head").animate({height:"288px"},500); }); $(".p2").click(function(){ $(".head").animate({height:"0px"},500); }); $(".bgcon img").hover(function(){ i=$(this).index(); $(".bgyl").css("background","url(images/bg"+i+".jpg)"); $(".bgyl").css("background-size","264px 180px"); }); $(".bgcon img").click(function(){ $("body").css("background","url(images/bg"+i+".jpg)"); });</script>
更多相关内容: