js anim小框架完善的有关问题
日期：2014-05-16 浏览次数：20437 次
js anim小框架完善的问题
- HTML code
<!DOCTYPE HTML>
<html>
<head>
<meta charset="gb2312" />
<title></title>
<style>
.a {
position:absolute; left:100px; top:100px;
width:100px; height:100px;
border:1px solid red; background:#ddd;
opacity:1;
}
</style>
</head>
<body>
<div id="a" class="a">a</div>
<div id="b">b</div>
<button id="pause">pause</button>
<button id="move">move</button>
<script>
function $(o){return document.getElementById(o)}
var Easing = {
'linear' : function(t){
return t;
},
'easeIn' : function(t){
return t * t;
},
'easeOut' : function(t) {
return ( 2 - t) * t;
},
'easeBoth' : function(t){
return (t *= 2) < 1 ?
.5 * t * t :
.5 * (1 - (--t) * (t - 2));
},
'easeInStrong' : function(t){
return t * t * t * t;
},
'easeOutStrong' : function(t){
return 1 - (--t) * t * t * t;
},
'easeBothStrong' : function(t){
return (t *= 2) < 1 ?
.5 * t * t * t * t :
.5 * (2 - (t -= 2) * t * t * t);
},
'elasticIn' : function(t){
var p = .3, s = p / 4;
if (t === 0 || t === 1) return t;
return -(Math.pow(2, 10 * (t -= 1)) * Math.sin((t - s) * (2 * Math.PI) / p));
},
'elasticOut' : function(t){
var p = .3, s = p / 4;
if (t === 0 || t === 1) return t;
return Math.pow(2, -10 * t) * Math.sin((t - s) * (2 * Math.PI) / p) + 1;
},
'elasticBoth' : function(t){
var p = .45, s = p / 4;
if (t === 0 || (t *= 2) === 2) return t;
if (t < 1) {
return -.5 * (Math.pow(2, 10 * (t -= 1)) *
Math.sin((t - s) * (2 * Math.PI) / p));
}
return Math.pow(2, -10 * (t -= 1)) *
Math.sin((t - s) * (2 * Math.PI) / p) * .5 + 1;
},
'backIn' : function(t){
if (t === 1) t -= .001;
return t * t * ((BACK_CONST + 1) * t - BACK_CONST);
},
'backOut' : function(t){
return (t -= 1) * t * ((BACK_CONST + 1) * t + BACK_CONST) + 1;
},
'backBoth' : function(t){
if ((t *= 2 ) < 1) {
return .5 * (t * t * (((BACK_CONST *= (1.525)) + 1) * t - BACK_CONST));
}
return .5 * ((t -= 2) * t * (((BACK_CONST *= (1.525)) + 1) * t + BACK_CONST) + 2);
},
'bounceIn' : function(t){
return 1 - Easing.bounceOut(1 - t);
},
'bounceOut' : function(t){
var s = 7.5625, r;
if (t < (1 / 2.75)) {
r = s * t * t;
}
else if (t < (2 / 2.75)) {
r = s * (t -= (1.5 / 2.75)) * t + .75;
}
else if (t <
免责声明： 本文仅代表作者个人观点，与爱易网无关。其原创性以及文中陈述文字和内容未经本站证实，对本文以及其中全部或者部分内容、文字的真实性、完整性、及时性本站不作任何保证或承诺，请读者仅作参考，并请自行核实相关内容。
