jQuery文字跑马灯插件Marquee

jQuery.Marquee是一款jQuery文字跑马灯插件。jQuery.Marquee跑马灯插件可以结合使用CSS3动画，制作文字的上下左右移动效果。

使用方法

在页面中引入jquery和jquery.marquee.js文件。

<script src="js/jquery.min.js" type="text/javascript"></script>  
<script src="js/jquery.marquee.js" type="text/javascript"></script>                  
                

如果需要跑马灯的暂停效果，引入jquery.marquee.js文件。

<script src="js/jquery.pause.js" type="text/javascript"></script>    
                

如果需要使用easing动画效果，引入jquery.easing.js文件。

<script src="js/jquery.easing.min.js" type="text/javascript"></script>   
                

HTML结构

使用一个块级元素作为跑马灯的容器。

<div id="container">跑马灯文字</div>
                

初始化插件

在页面DOM元素加载完毕之后，通过marquee()方法来初始化该插件。

$(function(){
    $('.marquee').marquee();        
});         
                

配置参数

该跑马灯插件的可用配置参数有：

• allowCss3Support ：如果浏览器支持CSS3动画，则使用CSS3动画。默认为true。
• css3easing：CSS3 easing效果，默认为'linear'。
• easing：jquery easing效果，默认为'linear'。
• delayBeforeStart：开始动画的延迟时候，单位毫秒，默认为1000。
• direction：跑马灯动画的方向。默认为left。
• duplicated：是否复制文本。默认为false。
• duration：动画的持续时间，单位毫秒，默认为5000。
• speed：speed参数会覆盖duration。
• gap：tickers之间的间隙。单位像素，默认为20。
• pauseOnHover：在hover时暂停跑马灯。
• pauseOnCycle：在循环结束，暂停跑马灯delayBeforeStart毫秒。
• startVisible：跑马灯在开始时是否可见。

该jQuery跑马灯插件的github地址为：https://github.com/aamirafridi/jQuery.Marquee