Scrollocue是一个jQuery滚动插件,它允许您使用箭头键、空格键或点击来平滑地滚动文本行,类似于自动提词器系统。
1.创建要浏览的文本。默认情况下,插件将处理用<h1>
和<p>
。您可以在下一步中设置自定义选择器。
- <div id="demo">
- <h1>Title</h1>
- <p>TEXT 1</p>
- <p>TEXT 2</p>
- <p>TEXT 3</p>
- </div>
2.在页面底部加载jQuery Scrollocue插件,但要在jQuery库之后加载。
- <script src="/path/to/cdn/jquery.min.js"></script>
- <script src="/path/to/js/scrollocue.js"></script>
3.附加功能滚动框()
到父容器,并使用以下参数配置滚动动画:
- $('#demo').scrollocue({
- // selector
- lineSelector: 'h1, p',
- // duration of animation
- scrollDuration: 1000,
- // easing function
- scrollEasing: 'easeOutQuad'
- });
2023-04-18