首页 > 代码库 > 上下切换js

上下切换js

<div class="wview">	<span class="prevs" id="prevs-j"></span> 																<ul class="JQ-slide-content" id="slide-j">					<li>						<a href="http://www.mamicode.com/#"><img src="http://www.mamicode.com/temp/id01.jpg" alt="3D坦克极速冰风暴">3D坦克极速冰风暴<i></i></a>						<a href="http://www.mamicode.com/#"><img src="http://www.mamicode.com/temp/id01.jpg" alt="3D坦克极速冰风暴">3D坦克极速冰风暴<i></i></a>						<a href="http://www.mamicode.com/#"><img src="http://www.mamicode.com/temp/id01.jpg" alt="3D坦克极速冰风暴">3D坦克极速冰风暴<i></i></a>						<a href="http://www.mamicode.com/#"><img src="http://www.mamicode.com/temp/id01.jpg" alt="3D坦克极速冰风暴">3D坦克极速冰风暴<i></i></a>					<li>						<a href="http://www.mamicode.com/#"><img src="http://www.mamicode.com/temp/id01.jpg" alt="3D坦克极速冰风暴">3333D坦克极速冰风暴<i></i></a>						<a href="http://www.mamicode.com/#"><img src="http://www.mamicode.com/temp/id01.jpg" alt="3D坦克极速冰风暴">3D坦克极速冰风暴<i></i></a>						<a href="http://www.mamicode.com/#"><img src="http://www.mamicode.com/temp/id01.jpg" alt="3D坦克极速冰风暴">3D坦克极速冰风暴<i></i></a>						<a href="http://www.mamicode.com/#"><img src="http://www.mamicode.com/temp/id01.jpg" alt="3D坦克极速冰风暴">3D坦克极速冰风暴<i></i></a>		  </ul>	<span class="nexts" id="nexts-j"></span></div>

 

$("#prevs-j").click(function(){    var wrap = $("#slide-j"),        h = wrap.height(),        lis = wrap.find(‘li‘).first();    if(!lis.is(":animated")){            lis.animate({‘margin-top‘:‘-‘+ h + ‘px‘},1000,function(){                lis.css(‘margin-top‘,0).appendTo(wrap);            });    }});$("#nexts-j").click(function(){    var wrap = $("#slide-j"),        h = wrap.height(),        lis = wrap.find(‘li‘).last();      lis.css(‘margin-top‘,‘-‘+ h + ‘px‘).prependTo(wrap);    if(!lis.is(":animated")){                  lis.animate({‘margin-top‘:0},1000);    }});