<div class="codetitle"> <span><a style="CURSOR: pointer" data="41460" class="copybut" id="copybut41460" onclick="doCopy('code41460')"><u>复制代码</u></a></span> 代码如下:</div> <div class="codebody" id="code41460"> <br> <br> <br> <br><title>Untitled Page</title> <br><link rel="Stylesheet" type="text/css" href="Result-Css/reset/reset-min.css"> <br><style type="text/css"> <BR>.w_con{ width:400px; height:160px; overflow:hidden; border:1px solid #333;} <BR>#w_slid{ width:100%;} <BR>#w_slid li{ width:100%; height:40px;} <BR>li.a{ background:#ffc000;} <BR>li.b{ background:#56aaff;} <BR>li.c{ background:#0fffaa;} <BR>li.d{ background:#0ffffa;} <BR>li.e{ background:#ffff56;} <BR></style> <br><script type="text/javascript" src="Result-JavaScriptOrJQuery/jquery/jquery-1.7.2.js"></script> <br> <br> <br><div class="w_con" id="w_con"> <br><ul id="w_slid"> <br><li class="a"> <br><li class="b"> <br><li class="c"> <br><li class="d"> <br><li class="e"> <br> </ul> <br> </div> <br><script type="text/javascript"> <BR>function slide() { <BR>var $w_slid = $('#w_con'); <BR>console.log($w_slid); <BR>var Timer; <BR>$w_slid.hover(function(){ <BR>clearInterval(Timer); <BR>},function(){ <BR>Timer = setInterval(function(){ <BR>slideFadeIn($w_slid); <BR>},3000); <BR>}).trigger("mouseleave"); <BR>} <BR>function slideFadeIn(obj) { <BR>var $self = obj.find('ul:first'); <BR>var $height = $self.find('li:first').height(); <BR>console.log($height); <BR>$self.animate({ <BR>'marginTop':+$height+'px', <BR>}, 1200, function () { <BR>$self.css({ marginTop: 0 }).find("li:first").appendTo($self); <BR>$self.find("li:first").hide(); <BR>$self.find("li:first").fadeIn("slow"); <BR>}); <BR>} <BR>$(function () { <BR>slide(); <BR>}); <BR></script> <br> <br> <br> </div>