lightSlider轻量级响应式滑动图片插件

lightSlider轻量级响应式滑动图片插件

lightSlider是一个图片插件,支持移动端响应式、触摸滑动、丰富的API回调函数、支持键盘,箭头事件、同个页面多个实例。

淘建站为您提供更多_图片代码_图片滑动_滑动_响应式,在此特别感谢您对我们的支持与厚爱!

查看演示

演示不了,点击反馈

加入收藏

下载 454 次

打赏作者

觉得不错,可打赏下作者

下载资源

免费共享

特别说明:本站资源来自网友发布分享,仅供学习与参考,请勿用于商业用途,若有侵权请联系删除(272966172@qq.com)。

HTML

<ul id="slideMove" class="gallery list-unstyled clearfix cS-hidden">
    <li> 
        <a href="http://www.sucaiq.com/js">
            <img src="img/cS-1.jpg" />
        </a> 
    </li>
    <li> 
        <a href="http://www.sucaiq.com/php">
            <img src="img/cS-2.jpg" />
        </a> 
    </li>
</ul>

演示一:每次滑动数量

$(function() {
    $('#slideMove').lightSlider({
        slideMove: 2, //滑动数量
        slideMargin: 4,
        slideWidth: 200
    });
});

演示二:相册

$('#imageGallery').lightSlider({
    gallery: true,
});

演示三:淡入淡出

$('#fade').lightSlider({
    mode:'fade'
});

演示四:滑动到指定位置

$('#goToSlide').click(function() {
    slider.goToSlide(3);
});

演示五:滑动到上一组

$('#goToPrevSlide').click(function() {
    slider.goToPrevSlide();
});

演示六:滑动到下一组

$('#goToPrevSlide').click(function() {
    slider.goToNextSlide();
});

声明:本资料由淘建站会员提供,如转载注明来源,资料来源淘建站免费素材库:https://www.taojz.cn/texiao/502.html
lightSlider轻量级响应式滑动图片插件 希望对你有帮助,感谢您的支持!
  • 原生js代码制作滑动步骤流程向导

    原生js代码制作滑动步骤流程向导

  • jQuery滑动图片以动画效果显示描述信息

    jQuery滑动图片以动画效果显示描述信息

  • 纯css3彩色的响应式进度条动画特效

    纯css3彩色的响应式进度条动画特效

  • html5手指滑动刻度尺选择值特效

    html5手指滑动刻度尺选择值特效

  • html5全屏响应式打开窗口遮罩动画特效

    html5全屏响应式打开窗口遮罩动画特效

  • js css3响应式垂直手风琴展开收缩效果

    js css3响应式垂直手风琴展开收缩效果

  • html5响应式分布式商品定制购物网站特效

    html5响应式分布式商品定制购物网站特效

  • html5 canvas手指滑动手机刮刮乐效果

    html5 canvas手指滑动手机刮刮乐效果

  • html5电子杂志支持手机端触屏滑动翻书效果

    html5电子杂志支持手机端触屏滑动翻书效果

  • 纯css3飞机跑道响应式进度条动画特效

    纯css3飞机跑道响应式进度条动画特效

  • jQuery+CSS3响应式线条滑出图片列表

    jQuery+CSS3响应式线条滑出图片列表

  • 手机上下滑动翻页动画加音乐

    手机上下滑动翻页动画加音乐

  • 留言(0)
    头像
     阿里云限量代金券,戳我领取
    1 2