jquery实现图片的左右滚动。
代码：

 
 
 
 
Jquery图片左右滚动-www. 
 
 
/* CSS reset */ 
body,div,dl,dt,dd,ul,ol,li,h1,h2,h3,h4,h5,h6,pre,form,fieldset,input,textarea,p
,blockquote,th,td{ margin:0; padding:0;
 font-size:12px; font-family:"宋体";} 
table{ border-collapse:collapse; border-spacing:0;} 
fieldset,img{ border:0; display:block;} 
address,caption,cite,code,dfn,em,strong,th,var{ font-style:normal; font-weight:normal;} 
ol,ul{ list-style:none;} 
caption,th{ text-align:left;} 
h1,h2,h3,h4,h5,h6{ font-size:100%; font-weight:normal;} 
.scroll{ width:300px; height:110px; overflow:hidden; position:relative; margin:100px auto 0; border:1px solid #ccc;} 
.scroll ul{ position:absolute; width:3000px;} 
.scroll li{ float:left; padding:5px 0;} 
 
 
 
    
 
        
 
            
 
            
 
            
 
            
 
            
 
            
 
        
 
    
 
  
  
     function AutoPlay(){ 
        var _scroll = $(".scroll ul"); 
        _scroll.animate({marginLeft : "-100px"},1000,function(){ 
            _scroll.css({marginLeft : "0px"}).find("li:first").appendTo(this);   
        });  
    } 
    jQuery(function(){ 
        var t = setInterval(function(){ 
            AutoPlay();  
        },3000); 
        $(".scroll").hover(function(){ 
            clearInterval(t);    
        },function(){ 
            t = setInterval(function(){ 
                AutoPlay();  
            },3000);     
        })   
    })   
  
 

您可能感兴趣的文章: