基于jquery实现轮播焦点图插件_

基于jquery实现轮播焦点图插件_

ID:63505703

大小:12.31 KB

页数:5页

时间:2021-08-24

基于jquery实现轮播焦点图插件__第1页
基于jquery实现轮播焦点图插件__第2页
基于jquery实现轮播焦点图插件__第3页
基于jquery实现轮播焦点图插件__第4页
基于jquery实现轮播焦点图插件__第5页
资源描述:

《基于jquery实现轮播焦点图插件_》由会员上传分享,免费在线阅读,更多相关内容在应用文档-天天文库

1、基于jquery实现轮播焦点图插件_这篇文章主要为大家具体介绍了基于jquery实现轮播焦点图插件,具有肯定的参考价值,代码很具体,感爱好的小伙伴们可以参考一下挺直上代码,可能不是最好的,欢迎吐槽。/***CreatedbyStevenon2021/07/10/0010.*@emailzhuttymore@126.com*/(function($){$.fn.slider=function(opt){opt=$.extend({speed:'fast',auto:false,interval:100

2、0},opt);var_this=this;varindex=0;_this.find('.windowli').width(_this.width());varanimate=function(index){varwin=_this.find('.window');varoffset=win.parent().width();win.animate({'marginLeft':-offset*index},opt.speed);_this.find('.tabli').removeClass('s

3、elect');_this.find('.tabli').eq(index).addClass('select');};_this.find('.tabli').mouseover(function(){index=parseInt($(this).index());animate(index);});_this.find('.btnli:first-child').click(function(){--index;if(index0){index=_this.find('.windowli').l

4、ength-1;}animate(index);});_this.find('.btnli:last-child').click(function(){++index;if(index=_this.find('.windowli').length){index=0;}animate(index);});if(opt.auto){vartime=setInterval(function(){++index;if(index=_this.find('.windowli').length){index=0

5、;}animate(index);},opt.interval);}return$.each(this,function(index,ele){});};})(jQuery);Htmldivclass="slider"ulclass="btn"liiclass="icon-caret-left"/i/liliiclass="icon-caret-right"/i/li/ululclass="window"liimgsrc="l的.slider里面的结构应当是一样。Run起来:$('.slider')

6、.slider({auto:true,interval:2021});改进js结构:/***CreatedbyStevenon2021/07/10/0010.*@emailzhuttymore@126.com*/(function($){$.fn.extend({slider:function(opt){opt=$.extend({},opt);//Dosomethingherereturn$.each(this,function(index,ele){});}});})(jQuery);以上就是本

7、文的全部内容,盼望对大家学习jqueryt程序设计有所关心。...

当前文档最多预览五页,下载文档查看全文

此文档下载收益归作者所有

当前文档最多预览五页,下载文档查看全文
温馨提示:
1. 部分包含数学公式或PPT动画的文件,查看预览时可能会显示错乱或异常,文件下载后无此问题,请放心下载。
2. 本文档由用户上传,版权归属用户,天天文库负责整理代发布。如果您对本文档版权有争议请及时联系客服。
3. 下载前请仔细阅读文档内容,确认文档内容符合您的需求后进行下载,若出现内容与标题不符可向本站投诉处理。
4. 下载文档时可能由于网络波动等原因无法下载或下载错误,付费完成后未能成功下载的用户请联系客服处理。