建站资源下载详情
为您免费提供多种建站资源下载,包括网站模板下载、前端插件下载和字体下载!您只需注册为会员即可任意下载!

JQuery文字动画插件:Morphext

来源:易助科技网浏览量:24收藏

简介


Morphext是一款简单、高性能和跨浏览器的jQuery文字动画插件。该文字动画jQuery插件基于Animate.css。你可以设置使用多个不同的句子,Morphext会以你指定的CSS3动画方式轮流显示它们。


JQuery文字动画插件:Morphext-示例图



使用


1. 引入


要在页面中引入jQuery文件和 Animate.css 文件以及 morphext.min.js和morphext.css文件。


2. HTML


将你想要动画的文字句子封装到一个元素中,并且用逗号隔开每一个句子。


I am a <span id="js-rotating">So Simple, Very Doge, Much Wow, Such Cool</span> Text Rotator


3. 调用 Morphext


可以在元素上调用Morphext()方法来启用插件:


$("#js-rotating").Morphext();


参数说明

animation:类型:string,CSS动画的类型,可以是 Animate.css 中任何一种可用的动画类型。默认值:bounceIn。
separator:类型:string,用于分割句子字符串的符号。可以改变这个符号,例如使用"|": So Simple | Very Doge | Much Wow | Such Cool。默认值:,speed:类型:int,文字动画的时间间隔,单位毫秒,默认值2000。



相关链接


官网地址 :  https://morphext.fyianlai.com/

github地址 : https://github.com/MrSaints/Morphext

演示地址 :http://www.htmleaf.com/Demo/201502021317.html