jQuery文字上下滚动插件meuiTextScroll

所属分类:UI-滚动

 2157  32  查看评论 (1)
分享到微信朋友圈
X
jQuery文字上下滚动插件meuiTextScroll ie兼容6

更新时间:2021-01-08 00:07:01

插件使用说明

meuiTextScroll 文字上下滚动自带翻页控件

控件调用方法

第1步,引入控件所需的CSS、JS

<link type="text/css" rel="stylesheet" href="assets/css/meui-textScroll.css">
<script src="https://www.jq22.com/jquery/jquery-1.10.2.js"></script>
<script type="text/javascript" src="src/meui-textScroll.js"></script><!--meui文字上下滚动-->

第2步,创建DOM节点

<div id="scrollBox"></div>

第3步,调用控件

$("#scrollBox").meuiTextScroll({
    content: '', //自定义滚动区域内容,默认空(可选). 注意:每一行数据HTML代码只能用li标签包裹,不能用其它标签
    source: { //数据源,仅当参数content不为空时有效.
        [
            {
                "title": "标题信息1",
                "description": "文本内容文本内容",
                "pubdate": "2020-12-15 14:32:21",
                "href": "http://****.com"
            },
            {
                "title": "标题信息2",
                "description": "文本内容文本内容",
                "pubdate": "2020-12-15 14:32:21",
                "href": "http://****.com"
            }
        ]
    },
    format: ["title", "description", "pubdate", "href"], //自定义数据源字段,数组格式,仅当参数content不为空时有效.(可选). 数组元素分别对应数据源字段:标题, 描述(可选), 发布时间(可选), 链接地址(可选)
    caption: '询价单最新消息', //区块标题(可选)
    width: 340, //滚动区域宽(可选)
    height: 500, //滚动区域高(可选)
    line: 1, //每次滚动的行数(可选)
    speed: 500, //滚动速度(毫秒)(可选)
    timer: 2000, //滚动间隔时间(毫秒)(可选)
    direction: 'up', //滚动方向(可选). up 向上(默认), down 向下
    pageBtn: true, //是否显示上下翻页按钮,默认true(可选)
    up: "but_up", //向上按钮ID属性名称(可选)
    down: "but_down" //向下按钮ID属性名称(可选)
})
相关插件-滚动

文字轮播无缝滚动

文字轮播无缝滚动
  滚动
 59358  513

jQuery鼠标滚屏锚点定位

利用mousewheel库实现滚屏事件,同时支持侧边栏控制
  滚动
 26031  345

jQuery滚动堆叠插件jquery.stacked-strips.js

为您的一页滚动网站和单页应用程序创建堆叠滚动效果。当您向下滚动网页时,插件可以逐个滚动固定的页面部分。
  滚动
 22113  292
  滚动
 28541  441

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

    马尔台尼亚小草 0
    2021/2/4 18:04:52
    兄弟你没发现 你这个定时滚动的过一段时间后就出问题了吗 滚动的特别快 回复
😃
  • 😀
  • 😉
  • 😥
  • 😵
  • 😫
  • 😘
  • 😡
  • 👍
  • 🌹
  • 👏
  • 🍺
  • 🍉
  • 🌙
  • 💖
  • 💔
😃
  • 😀
  • 😉
  • 😥
  • 😵
  • 😫
  • 😘
  • 😡
  • 👍
  • 🌹
  • 👏
  • 🍺
  • 🍉
  • 🌙
  • 💖
  • 💔
取消回复