zoukankan      html  css  js  c++  java
  • 上下切换js

    <div class="wview">
    	<span class="prevs" id="prevs-j"></span> 	
    												
    			<ul class="JQ-slide-content" id="slide-j">
    					<li>
    						<a href="#"><img src="temp/id01.jpg" alt="3D坦克极速冰风暴">3D坦克极速冰风暴<i></i></a>
    
    						<a href="#"><img src="temp/id01.jpg" alt="3D坦克极速冰风暴">3D坦克极速冰风暴<i></i></a>
    
    						<a href="#"><img src="temp/id01.jpg" alt="3D坦克极速冰风暴">3D坦克极速冰风暴<i></i></a>
    
    						<a href="#"><img src="temp/id01.jpg" alt="3D坦克极速冰风暴">3D坦克极速冰风暴<i></i></a>
    					<li>
    						<a href="#"><img src="temp/id01.jpg" alt="3D坦克极速冰风暴">3333D坦克极速冰风暴<i></i></a>
    
    						<a href="#"><img src="temp/id01.jpg" alt="3D坦克极速冰风暴">3D坦克极速冰风暴<i></i></a>
    
    						<a href="#"><img src="temp/id01.jpg" alt="3D坦克极速冰风暴">3D坦克极速冰风暴<i></i></a>
    
    						<a href="#"><img src="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);
        }
    
    
    
    });
    
  • 相关阅读:
    idea 的搭建 maven spark开发环境
    自己的简单数据分析流程
    自己对golang中各个文件的理解
    通用android studio gradle 文件(电商商家版,两个gradle不同)
    android与golang的http请求
    Leetcode 98 验证二叉搜索树
    leetcode 830较大分组的位置
    Leetcode 种花问题
    leetcode 86 分割链表
    Leetcode 509 斐波那契数
  • 原文地址:https://www.cnblogs.com/xupeiyu/p/3849124.html
Copyright © 2011-2022 走看看