当前位置: 首页 > 工具软件 > liMarquee > 使用案例 >

jQuery中使用liMarquee无缝滚动走马灯

谭成业
2023-12-01

前言

liMarquee官方文档

liMarquee 是一款基于 jQuery 的无缝滚动插件,类似于 HTML 的 marquee 标签,但比 marquee 更强大。它可以应用于任何 Web 元素,包括文字、图像、表格、表单等元素,同时它可以设置不同的滚动方向(左右上下)、滚动速度、鼠标悬停暂停、鼠标拖动、加载 xml 文件等等。

使用方法

首先去官方文档下载压缩包,取出我们想要的css和js文件放在我们的项目里

1、引入文件

<script src="https://cdn.staticfile.org/jquery/2.1.1/jquery.min.js"></script>
<script src="./js/jquery.liMarquee.js"></script>
<link rel="stylesheet" href="./css/liMarquee.css">

2、HTML

 <ul class="list">
     <li>这是第一条信息这是第一条信息这是第一条信息这是第一条信息</li>
     <li>这是第二条信息这是第二条信息这是第二条信息这是第二条信息</li>
     <li>这是第三条信息这是第三条信息这是第三条信息这是第三条信息</li>
     <li>这是第四条信息这是第四条信息这是第四条信息这是第四条信息</li>
 </ul>

3、JavaScript

   $(function(){
        $('.list').liMarquee({
            direction: 'up',
            scrollamount:10
        });
    });
 类似资料: