首页 > web前端 > js教程 > 正文

js jquery做的图片连续滚动代码_jquery

php中文网
发布: 2016-05-16 19:06:46
原创
1162人浏览过

核心代码如下,大家可以参考

Phenaki
Phenaki

phenaki是一种从文本生成视频的模型

Phenaki 93
查看详情 Phenaki
复制代码 代码如下:

 
<script> <BR>$(document).ready(function(){ <br><br> $(".bannerbutton li").each( <BR> function(){ <BR> $(this).click( <BR> function(){ <BR> bannerGo($(this).attr("num")); <BR> } <BR> ) <BR> } <BR> ) <BR> $(".img li:last").html($(".img li:first").html()); <BR>}); <BR>var active=1;//当前显示第1个 <BR>var picNum=4;//4个图转换 <BR>var time=500;//移动速度 <BR>var intTime=3000;//自动转换间隔时间 <BR>var width=568; //图片宽 <BR>var perDistance=57;//每次移动距离 <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>var move=false; <br><br><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> tagLeft=listLeft-distance; <BR> marquee=setInterval("Marquee(1)",perTime) <BR> }else{ <BR> tagLeft=listLeft-distance; <BR> marquee=setInterval("Marquee(0)",perTime) <BR> } <BR> active=Number(tag); <BR> if(active==picNum+1) <BR> active=1; <BR> move=true; <BR> } <BR> } <BR>} <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> 
 
 
        
     
                                       
  • 1
  •  
                                       
  • 2
  •  
                                       
  • 3
  •  
                                       
  • 4
  •  
           
 
  
     
                                
  • js jquery做的图片连续滚动代码_jquery
  •  
                                
  • js jquery做的图片连续滚动代码_jquery
  •  
                                
  • js jquery做的图片连续滚动代码_jquery
  •  
                                
  • js jquery做的图片连续滚动代码_jquery
  •  
                                
  •  
       
 

相关标签:
最佳 Windows 性能的顶级免费优化软件
最佳 Windows 性能的顶级免费优化软件

每个人都需要一台速度更快、更稳定的 PC。随着时间的推移,垃圾文件、旧注册表数据和不必要的后台进程会占用资源并降低性能。幸运的是,许多工具可以让 Windows 保持平稳运行。

下载
来源:php中文网
本文内容由网友自发贡献,版权归原作者所有,本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容,请联系admin@php.cn
最新问题
开源免费商场系统广告
热门教程
更多>
最新下载
更多>
网站特效
网站源码
网站素材
前端模板
关于我们 免责申明 举报中心 意见反馈 讲师合作 广告合作 最新更新
php中文网:公益在线php培训,帮助PHP学习者快速成长!
关注服务号 技术交流群
PHP中文网订阅号
每天精选资源文章推送

Copyright 2014-2025 https://www.php.cn/ All Rights Reserved | php.cn | 湘ICP备2023035733号