jQuery上下左右滚动插件rollSlide.js

所属分类:UI-滚动

 67644  557  查看评论 (62)
分享到微信朋友圈
X
jQuery上下左右滚动插件rollSlide.js ie兼容8

间隔滚动

.rollSlide(obj)方法:
    参数 obj 为对象,
            orientation: string, 滚动方式 'left',
            'right','top','bottom' 4个方向,默认为 'left'
            num: number, 滚动数量  默认为 1
            v:numer, 滚动速度  默认为 0
            space:number, 间隔时间  默认时间为 5000ms, 最小间隔时间为 100ms
            isRoll: boolean,  是否自动播放   必填,没有默认值

不间断滚动 

.rollNoInterval()方法:
    无参数, 返回4个方法
        .left()  左方向滚动
        .right()  右方向滚动
        .top()  上方向滚动
        .bottom()  下方向滚动


相关插件-滚动

视觉滚动差效果

纯css3写的滚动视差效果
  滚动
 30991  357

双向垂直上下滚动

垂直滚动插件,可切换向上或向下方向滚动。
  滚动
 46364  374

jQuery横向全屏切换滚动

jQuery横向全屏切换滚动兼容ie6
  滚动
 48881  454

文字轮播无缝滚动

文字轮播无缝滚动
  滚动
 72177  567

讨论这个项目(62)回答他人问题或分享插件使用方法奖励jQ币 评论用户自律公约

    Strive ° 0
    2019/6/18 16:11:10
    下载下来感觉很好用
        年轻真好/qq0
        2019/6/19 17:46:35
        是的
    回复
    需要努力啊咩 0
    2019/3/28 15:35:03
    感觉还行
        泽九0
        2022/4/11 13:42:48
        是的
    回复
    天晓 0
    2019/3/24 10:27:53
    一统天下 0
    2019/3/18 10:19:41
    能单独对tbody进行轮播吗?Thead不轮播 回复
    一统天下 0
    2019/3/18 10:18:12
    感觉很不错的样子哦 回复
    Destiny 0
    2019/3/13 16:48:29
    可适用于手机端嘛 回复
    ? 0
    2019/1/17 11:18:32
    不间断滚动怎么给它加悬浮暂停 回复
    歌?S滕 0
    2019/1/11 14:11:48
    复制的第二帧没有点击事件啊,显示没有方法 回复
    物语 0
    2018/12/21 14:44:46
    可以用吗?好用吗 回复
    喂、、丫头!放下你的低调 0
    2018/6/20 13:43:27
    自动滚动很长时间后,会出现某一页连续重播, 怎么处理?
        xiaowiba0
        2018/6/23 10:25:12
        同问,感谢
        bbh0
        2018/7/11 10:03:01
        用的什么感觉
        物语0
        2018/12/21 14:45:17
        好用吗?
        悠悠的fish 0
        2019/5/13 10:45:32
        同问
        悠悠的fish 0
        2019/5/13 10:57:48
        v的值必须小于space;例如 v: 1000, space:2000, 这样是不会出现你说的情况!
        Strive °0
        2019/6/18 16:11:53
        同问
        四夕柒0
        2019/12/7 13:54:09
        同问
        柠檬不酸i0
        2020/4/29 14:57:42
        我不需要space怎么办
        柠檬不酸i1
        2020/4/29 17:11:05
        case 'left':
            $ul.append(cloneSliceItem);
            $ul.animate({
                'left': -range + 'px'
            }, v, function() {
                $(this).css({
                    'left': 0
                });
                $(sliceItem).remove();
                isStart = true; //开启滚动
            });
            break;

        自动滚动很长时间后,会出现某一页连续重播,是因为$(sliceItem).remove();写在了animate里面,animate还没执行完,下一个push的时候获取的就是还没有删完的li,所以在后面就会出现重复的问题,
        把$(sliceItem).remove();放在animate外面就解决了重复的问题,但是在滚动的左侧会出现闪一下再删除,动画效果不好

    回复
😃
  • 😀
  • 😉
  • 😥
  • 😵
  • 😫
  • 😘
  • 😡
  • 👍
  • 🌹
  • 👏
  • 🍺
  • 🍉
  • 🌙
  • 💖
  • 💔
😃
  • 😀
  • 😉
  • 😥
  • 😵
  • 😫
  • 😘
  • 😡
  • 👍
  • 🌹
  • 👏
  • 🍺
  • 🍉
  • 🌙
  • 💖
  • 💔
取消回复