这是一款 jQuery 文字动画特效插件。该 jquery 文字动画插件结合 animate.css 一起使用,可以制作出各种炫酷的文字动画特效。
在页面中引入 animate.css 和 rotator.css 文件,以及 jquery 和 jquery.rotator.js 文件。
<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>
<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 文字动画插件。
$(".rotate").rotator();
该 jquery 文字动画插件的 github 地址为:https://github.com/ht2pl/rotator
演示地址 | 下载地址 |
专业提供WordPress主题安装、深度汉化、加速优化等各类网站建设服务,详询在线客服!