jQuery无缝滚动插件(原创)

所属分类:UI,媒体-滚动,Tabs

 14383  127  查看评论 (5)
分享到微信朋友圈
X
jQuery无缝滚动插件(原创) ie兼容10

更新时间:2020-08-28 22:51:56

更新说明:默认支持 CSS 方式的移动,解决 JS 移动抖动的 Bug


更新时间:2020-08-28 10:20:01

i5Scroll

基本使用

<script src="./js/jquery.min.js"></script>
<script src="./js/i5scroll.min.js"></script>
<script>
    // 选择需要运动的元素,直接调用 i5Scroll() 即可
    $(".scroll").i5Scroll();
</script>

一个参数

$(".scroll").i5Scroll({
    mode: 'CSS', // 默认通过 CSS 的方式移动
    cssSpeed: 5, // 时间默认 5s
});
$(".scroll").i5Scroll({
    mode: 'JS', // 也可以通过 JS 的方式移动
    jsSpeed: 'normal', // 默认 normal
});

我的特点

  •  支持隐藏元素滚动

  •  解决滚动时“抖动”的问题

相关插件-滚动,Tabs

双向垂直上下滚动

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

jQuery滚轮控制轮播图上下切换(原创)

jQuery滚轮控制轮播图上下切换,简单实用
  滚动
 36606  336

jQuery元素滚动监听插件xRoll.js

xRoll.js 元素滚动监听插件 元素出现在窗口的时候在执行自定义的函数
  滚动
 21834  316

jquery模拟滚动条(未封装)

jquery模拟滚动条,支持自定义滚动条样式,兼容pad,web手机端未测试;支持同一网页多个滚动条;支持添加和删除(本人对封装不太了解,未封装)
  滚动
 36137  334

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

      0
    2021/8/10 9:19:37
    抖动问题还是在呀
    😥 回复
    &Good丶night 0
    2021/3/3 14:30:53
    请问支持横向滚动吗 回复
    心若冰清 0
    2020/11/23 16:10:28
    如何能让文字内容长了自动换行,而不是隐藏,就完美了 回复
    渡我 0
    2020/9/10 15:07:00
    怎么增加一栏呢
        小闰土1
        2020/9/23 17:30:18

        我简单看了一下
        i35-title 这个ul 里 增加一个标题

        <li>新的标题</li>

        i35-con div 里增加以下代码

        <div class="content">
            <ul class="scroll">
                <li>新的内容行1</li>
                <li>新的内容行2</li>
                <li>新的内容行3</li>
            </ul>
        </div>

        以下为原代码------------------------------------------------

        <div class="i35-wrap">
            <ul class="i35-title">
                <li class="active">布丽吉塔</li>
                <li>秩序之光</li>
            </ul>
            <div class="i35-con">
                <div class="content" style="display: block;">
                    <ul class="scroll">
                        <li>先帝创业未半而中道崩殂,今天下三分,益州疲弊</li>
                        <li>此诚危急存亡之秋也,然侍卫之臣不懈于内</li>
                        <li>忠志之士忘身于外者,盖追先帝之殊遇</li>
                        <li>欲报之于陛下也~</li>
                    </ul>
                </div>
                <div class="content">
                    <ul class="scroll">
                        <li>诚宜开张圣听,以光先帝遗德</li>
                        <li>恢弘志士之气,不宜妄自菲薄</li>
                        <li>引喻失义,以塞忠谏之路也</li>
                        <li>宫中府中,俱为一体,陟罚臧否,不宜异同</li>
                        <li>若有作奸犯科及为忠善者,宜付有司论其刑赏,以昭陛下平明之理,不宜偏私,使内外异法也。</li>
                    </ul>
                </div>
            </div>
        </div>
    回复
😃
  • 😀
  • 😉
  • 😥
  • 😵
  • 😫
  • 😘
  • 😡
  • 👍
  • 🌹
  • 👏
  • 🍺
  • 🍉
  • 🌙
  • 💖
  • 💔
😃
  • 😀
  • 😉
  • 😥
  • 😵
  • 😫
  • 😘
  • 😡
  • 👍
  • 🌹
  • 👏
  • 🍺
  • 🍉
  • 🌙
  • 💖
  • 💔
取消回复