Home  >  Article  >  Web Front-end  >  Continuous scrolling code for pictures made with js jquery_jquery

Continuous scrolling code for pictures made with js jquery_jquery

WBOY
WBOYOriginal
2016-05-16 19:06:461028browse

The core code is as follows, you can refer to

Copy the code The code is as follows:


<script> <br>$(document).ready(function(){ <br> <br> $(".bannerbutton li").each( <br> function(){ <br> $(this).click( <br> function(){ <br> "num")); <br>                                             )                                                                                                                      ()); <br>}); <br>var active=1;//Currently displaying the 1st one <br>var picNum=4;//Converting 4 pictures <br>var time=500;//Move Speed ​​<br>var intTime=3000; //Automatic conversion interval <br>var width=568; //Picture width <br>var perDistance=57; //Distance of each movement <br>var tagObj=0; <br>var marquee; <br>var autoMarquee; <br>var distance; <br>var tmpDistance=0; <br>var listLeft=0; <br>var tagLeft=0; 🎜> <br> <br> Function bannergo (tag) {<br> if (active! = Tag) {<br> if (! Move) {<br> listleft = PARSEINT ($ (". Banner ul .img").css("left")); <br> distance=(tag-active)*width; <br> tmpDistance=0; <br> perTime=parseInt(time*perDistance/distance); <br> if(tag>active){ <br>                                                                                                      <br> tagLeft=listLeft-distance; <br> marquee=setInterval("Marquee(0)",perTime) <br>                                                                                                      active=1; true;  <br><br>function Marquee(t){  <br>       var x=false;  <br>       if(t==0){  <br>              listLeft=listLeft perDistance;  <br>              if((tagLeft-listLeft)>=perDistance){  <br>                     $(".banner ul.img").css("left",listLeft "px");  <br>              }else{  <br>                     $(".banner ul.img").css("left",tagLeft "px");  <br>                     x=true;  <br>              }  <br>       }else{  <br>              listLeft=listLeft-perDistance;  <br>              if((tagLeft-listLeft)<=perDistance){  <br>                     $(".banner ul.img").css("left",listLeft "px");  <br>              }else{  <br>                     $(".banner ul.img").css("left",tagLeft "px");  <br>                     x=true;  <br>              }  <br>       }  <br>       if(x){  <br>              clearInterval(marquee);  <br>              tmpDistance=0;  <br>              listLeft=0;  <br>              tagLeft=0;  <br>              move=false;  <br>              $(".bannerbutton li").css("background","url(/images/index/b2.gif) no-repeat");  <br>              $(".bannerbutton li[@num=" active "]").css("background","url(/images/index/b1.gif) no-repeat");  <br>              if(tagObj==picNum 1){  <br>              $(".banner ul.img").css("left","0");  <br>              active=1;  <br>              }  <br>       }  <br>}  <br><br>function autoMarquee(){  <br>       tagObj=Number(active) 1;  <br>       bannerGo(tagObj);  <br>}  <br><br>function autoMarqueeStart(){  <br>       if(!move){  <br>       marquee=setInterval("autoMarquee()",intTime)  <br>       }else{  <br>       setTimeout("autoMarqueeStart()",time);  <br>       }  <br><br>}  <br>autoMarqueeStart();  <br></script> 
 
 
         
                                   
                                   
                                   
                                   
        
   
                            
  •  
                                
  •  
                                
  •  
                                
  •  
                                
  •  
        

    Statement:
    The content of this article is voluntarily contributed by netizens, and the copyright belongs to the original author. This site does not assume corresponding legal responsibility. If you find any content suspected of plagiarism or infringement, please contact admin@php.cn
    Previous article:Interpret the execution order of JScript and HREF under IE and Firefox_javascript skillsNext article:Interpret the execution order of JScript and HREF under IE and Firefox_javascript skills

    Related articles

    See more