欢迎投稿

菜鸟之家

当前位置:菜鸟之家 > jquery库 > 工具类 > 支持5种炫酷动画类型的jQuery插件-EnlivenTricks.js

支持5种炫酷动画类型的jQuery插件-EnlivenTricks.js

支持5种炫酷动画类型的jQuery插件-EnlivenTricks.js

关键词:动画,jquery动画,jquery动画插件,jquery动画特效,平移动画,淡入淡出,抖动动画,缩放动画,loading动画,jquery库,gongjulei

描述:EnlivenTricks.js是一款支持5种炫酷动画类型的jQuery插件。该jQuery插件支持淡入淡出、抖动、缩放、平移和loading等5种动画。

简要教程

EnlivenTricks.js是一款支持5种炫酷动画类型的jQuery插件。该jQuery插件支持淡入淡出、抖动、缩放、平移和loading等5种动画。

使用方法

在页面中引入EnlivenTricks.css、jquery和EnlivenTricks.js文件。

<link href="dist/bootstrap.css" rel="stylesheet">
<script src="jquery.min.js"></script>
<script src="EnlivenTricks.js"></script>
                
淡入淡出动画
$(".element").FadeTrick({
  duration: 500, 
  disappear: false,
  mode: "in"
})
                
  • duration:动画的持续时间。
  • disappear:是否在淡出之后移除元素。
  • mode:淡入或淡出。
抖动动画
$(".element").ShakeTrick({
  times: 6
  wrapper: false
})
                
  • times:抖动的次数。
  • wrapper:包裹元素。
缩放动画
$(".element").BlobTrick()
                
平移动画
$(".element").SwapTrick({
  revert: false, 
  vertical: false, 
  next: null,
  callback: function() {return;}
})
                
  • revert:恢复动画。
  • vertical:垂直还是水平动画。
  • next:下一个移动的元素。
  • callback:回调函数。
loading动画
$(".element").LoadTrick({
  color: "white",
  appearance: "simple",
  position: { left: "42%", right: 0, bottom: 0, top: 0 },
  delayHandler: 5000
})
                
  • color:动画元素的颜色。
  • appearance:"square", "flash", "disk", "spinner", "fixed-spinner", "classic-spinner", "simple"。
  • position:自定义位置。
  • delayHandler:interger, "infinite",或一个函数。

EnlivenTricks.js插件的github网址为:https://github.com/hupiat/EnlivenTricks.js

说明:菜鸟之家所有素材均是用户自行上传分享并拥有版权或使用权,仅供网友学习交流,未经上传用户书面授权,请勿作他用。若您的权利被侵害,请联系QQ:11809283或发送邮件至11809283@qq.com。

菜鸟之家承诺:本站所有资源,无需注册,免费下载,无病毒,无弹窗,无干扰链接!

转载请注明出处!本文地址:http://www.jeeok.com/jquery_gongjulei/9611.html

 在线演示  免费下载
编号:201903070000009611
大小:0.08MB
上传时间:2019-03-14 07:07
素材由用户"zf10172"上传分享。

标签

最新推荐素材

与支持5种炫酷动画类型的jQuery插件-EnlivenTricks.js相关的素材

.