ShuffleText 是一款纯 js 文字洗牌式切换特效插件。该插件在鼠标滑过指定的文本时,文字会不停的逐个进行翻转,类似洗牌效果,非常炫酷。
在页面中引入 shuffle-text.js 文件。
<script src="path/to/shuffle-text.js"></script>
ShuffleText 插件基本的 HTML 结构如下:
<!DOCTYPE html>
<html>
<head>
<script src="shuffle-text.js"></script>
</head>
<body>
<h1 id="myText">This is a ShuffleText.js Examle</h1>
<script>
var el = document.getElementById("myText");
var text = new ShuffleText(el);
text.start();
</script>
</body>
</html>
通过下面的方法为要进行洗牌切换的文字创建实例对象。
var el = document.getElementById("myText");
var text = new ShuffleText(el);
ShuffleText 洗牌式文字切换插件可用的方法有:
//开始执行洗牌动画
start(): void
//结束洗牌动画
stop(): void
//设置文字
setText(text: string): void
dispose(): void
ShuffleText 纯 js 文字洗牌式切换特效插件的 github 地址为:https://github.com/ics-ikeda/shuffle-text
演示地址 | 下载地址 |
专业提供WordPress主题安装、深度汉化、加速优化等各类网站建设服务,详询在线客服!