读书人

JS动画片算法学习

发布时间: 2012-11-23 00:03:43 作者: rapoo

JS动画算法学习

function Opacity(dom , spec) {Element.extend(dom);var from = spec.from || dom.getOpacity();var to = spec.to || '1.0';var fps = spec.fps || 100;var delay = spec.delay || 0;var duration = spec.duration;var startOn = delay * 1000;var finishOn = startOn + duration * 1000;var totalTime = finishOn - startOn;var totalFrames  = fps * duration;var currentFrame = 0;var fromToDelta = to - from ;var interval;var transition = function(pos) {      return (-Math.cos(pos*Math.PI)/2) + .5;    };function render(pos) {pos = (transition(pos) * fromToDelta) + from;dom.setStyle({opacity : pos});}function loop() {var timePos = new Date().getTime();if (timePos >= finishOn) {        render(1);        return;      }var pos   = (timePos - startOn) / totalTime,          frame = (pos * totalFrames).round();      if (frame > currentFrame) {        render(pos);        currentFrame = frame;      }      interval = setTimeout(loop , 15);}var stamp = new Date().getTime();startOn += stamp;finishOn += stamp;interval = setTimeout(loop , 15);}Opacity($('d2') , {to : 0.3,duration : 3,delay : 1});
?

读书人网 >JavaScript

热点推荐