Jjcarousellite 实现图片列表滚动的简单实例


Posted in Javascript onNovember 29, 2013

jcarousel Lite与jcarousel 相比去掉了皮肤的约束,可以自定义的设置前后按钮和选项卡按钮,生成的html更加简洁,文件更小(2k)
下载链接:
使用方法:http://www.gmarwaha.com/jquery/jcarousellite/

<div class="类名">
  <ul>
    <li></li>
  </ul>
</div>
<script type="text/javascript" src="js/jquery-1.3.2.min.js"></script>
<script type="text/javascript" src="js/jcarousellite_1.0.1.min.js"></script>
<script type="text/javascript">
    $(document).ready(function(){
        $(".类名").jCarouselLite({
            btnNext: ".next",    
            btnPrev: ".prev",
            //btnGo: [".1", ".2"], //自定义滚动位置选项卡,按照数组顺序
            //auto: 2000,            //指定多少毫秒定期自动滚动。默认为null
            //speed: 800,            //滑动的速度,可以尝试800 1000 1500
            //vertical:false,        //是否垂直滚动,默认false
            //circular:true,        //是否循环滚动,默认为true
            //visible:3,            //元素可见数量,可以为小数,如2.5为2.5个li
            //scroll:1,                //每次滚动的li数量
            //start:0,                //开始的地方,默认是0
            //beforeStart:function(){}    //滚动开始时回调的函数
            //afterEnd:function(){}        //滚动结束时回调的函数
        });
    });
</script>
Javascript 相关文章推荐
IE6、IE7中获取Button元素的值的bug说明
Aug 28 Javascript
javascript 3d 逐侦产品展示(核心精简)
Mar 26 Javascript
浅谈js中变量初始化
Feb 03 Javascript
可以浮动某个物体的jquery控件用法实例
Jul 24 Javascript
JavaScript对Cookie进行读写操作实例
Jul 25 Javascript
BetterScroll 在移动端滚动场景的应用
Sep 18 Javascript
Promise.all中对于reject的处理方法
Aug 01 Javascript
详解Node.js中path模块的resolve()和join()方法的区别
Oct 29 Javascript
小白教程|一小时上手最流行的前端框架vue(推荐)
Apr 10 Javascript
Vue实现手机扫描二维码预览页面效果
May 28 Javascript
js实现抽奖的两种方法
Mar 19 Javascript
vite2.0+vue3移动端项目实战详解
Mar 03 Vue.js
JS实现多物体缓冲运动实例代码
Nov 29 #Javascript
JS实现匀速运动的代码实例
Nov 29 #Javascript
JS实现侧悬浮浮动实例代码
Nov 29 #Javascript
js模拟点击以提交表单为例兼容主流浏览器
Nov 29 #Javascript
JS实现日期加减的方法
Nov 29 #Javascript
js弹出层永远居中实现思路及代码
Nov 29 #Javascript
根据表格中的某一列进行排序的javascript代码
Nov 29 #Javascript
You might like
解析php通过cookies获取远程网页的指定代码
2013/06/25 PHP
thinkPHP模板引擎用法示例
2016/12/08 PHP
Laravel5.5 动态切换多语言的操作方式
2019/10/25 PHP
Laravel Eloquent分表方法并使用模型关联的实现
2019/11/25 PHP
PHP+ajax实现上传、删除、修改单张图片及后台处理逻辑操作详解
2020/02/12 PHP
php让json_encode不自动转义斜杠“/”的方法
2020/04/27 PHP
javascript之解决IE下不渲染的bug
2007/06/29 Javascript
JavaScript页面刷新与弹出窗口问题的解决方法
2010/03/02 Javascript
根据对象的某一属性进行排序的js代码(如:name,age)
2010/08/10 Javascript
JS基础之undefined与null的区别分析
2011/08/08 Javascript
使用Post提交时须将空格转换成加号的解释
2013/01/14 Javascript
AngularJS实现的回到顶部指令功能实例
2017/05/17 Javascript
详解微信小程序设置底部导航栏目方法
2017/06/29 Javascript
vue 里面使用axios 和封装的示例代码
2017/09/01 Javascript
React Native中的RefreshContorl下拉刷新使用
2017/10/09 Javascript
JS去掉字符串末尾的标点符号及删除最后一个字符的方法
2017/10/24 Javascript
JavaScript 截取字符串代码实例
2019/09/05 Javascript
JavaScript进阶(二)词法作用域与作用域链实例分析
2020/05/09 Javascript
[05:08]2014DOTA2国际邀请赛 Hao专访复仇的胜利很爽
2014/07/15 DOTA
Django读取Mysql数据并显示在前端的实例
2018/05/27 Python
Tensorflow中的图(tf.Graph)和会话(tf.Session)的实现
2020/04/22 Python
浅谈matplotlib中FigureCanvasXAgg的用法
2020/06/16 Python
Python实时监控网站浏览记录实现过程详解
2020/07/14 Python
纯HTML+CSS3制作导航菜单(附源码)
2013/04/24 HTML / CSS
CSS 3.0 结合video视频实现的创意开幕效果
2020/06/01 HTML / CSS
达拉斯牛仔官方商店:Dallas Cowboys Pro Shop
2018/02/10 全球购物
Origins悦木之源香港官网:雅诗兰黛集团高端植物护肤品牌
2018/03/21 全球购物
LORAC官网:美国彩妆品牌
2019/08/27 全球购物
耐克波兰官方网站:Nike波兰
2019/09/03 全球购物
英国在线照明超市:Castlegate Lights
2019/10/30 全球购物
俄罗斯苹果优质经销商商店:iPort
2020/05/27 全球购物
关于期中考试的反思
2014/02/02 职场文书
计算机通信专业推荐信
2014/02/22 职场文书
2015年汽车销售经理工作总结
2015/04/27 职场文书
企业员工辞职信范文
2015/05/12 职场文书
民事答辩状范本
2015/05/21 职场文书