本文主要是介绍jQuery Easing.js 插件的简单使用,希望对大家解决编程问题提供一定的参考价值,需要的开发者们随着小编来一起学习吧!
jQuery Easing.js 插件的简单使用
==介绍:==easing是jquery的一个插件,使用它可以创建更加绚丽的动画效果。
==环境:==因为easing是jQuery的插件,所以必须是在引入jquery之后再引入它
简单的写法
$(".car").animate({"left": "150%"}, 4000, "easeInElastic", function() {});
easing:格式为json,{ duration: 持续时间, easing: 过渡效果, complete: 成功后的回调函数}
示例:
$(element).animate({ height:500, width:600 },{ easing: 'easeInOutQuad', duration: 500, complete: function(){}
});
easing常见的值如下:
- linear
- swing
- easeInQuad
- easeOutQuad
- easeInOutQuad
- easeInCubic
- easeOutCubic
- easeInOutCubic
- easeInQuart
- easeOutQuart
- easeInOutQuart
- easeInQuint
- easeOutQuint
- easeInOutQuint
- easeInExpo
- easeOutExpo
- easeInOutExpo
- easeInSine
- easeOutSine
- easeInOutSine
- easeInCirc
- easeOutCirc
- easeInOutCirc
- easeInElastic
- easeOutElastic
- easeInOutElastic
- easeInBack
- easeOutBack
- easeInOutBack
- easeInBounce
- easeOutBounce
- easeInOutBounce
不同值得图示:
jQuery Easing Examples的网址
这篇关于jQuery Easing.js 插件的简单使用的文章就介绍到这儿,希望我们推荐的文章对编程师们有所帮助!