jQuery炫酷文字动画特效代码插件

jQuery炫酷文字动画特效代码插件

这是一款jQuery文字动画特效插件。该jquery文字动画插件结合animate.css一起使用,可以制作出各种炫酷的文字动画特效。

使用方法
在页面中引入animate.css和rotator.css文件,以及jquery和jquery.rotator.js文件。

1
2
3
4
<link href="css/animate.css" rel="stylesheet">
<link href="css/rotator.css" rel="stylesheet">
<script type="text/javascript" src="js/jquery.min.js"></script>            
<script type="text/javascript" src="js/jquery.rotator.js"></script>

HTML
基本的HTML结果如下:

1
2
3
4
5
6
7
8
9
<div id="example1" class="rotate" data-rotate-interval="3000" data-rotate-animate="zoomIn,zoomOut">      
    <h1>Welcome to <span class="rotate-arena"></span></h1>                
    <ul>
       <li>text totate 2</li>
       <li>text totate 3</li>
       <li>text totate 4</li>
       <li>text totate 5</li>
    </ul>    
</div>

初始化插件
在页面DOM元素加载完毕之后,通过下面的方法来初始化该jquery文字动画插件。

1
$(".rotate").rotator();

文件信息:

    0

    发表评论