JS Tween 색상 그 라 데 이 션
function alpha2() { var t = rtween(1,0,1,type); t.run = function(ps) { $('#t').css('opacity',ps); } t.complete = function() { rtween(0,1,1,type).run = function(ps) { $('#t').css('opacity',ps); } } }
소스 코드:http://img.jb51.net/jslib/jquery/rtween.js핵심 코드:function Tween(){this.frame=20; // this._animType = linear; this._delay = 0; // this.run = function(){} this.complete = function(){} } // Tween.prototype.getValue = function(prop) { this._valueType = ”; if(prop.constructor == Array) return prop; // if(typeof(prop) == 'string') { if(isColor(prop)) { this._valueType = ‘color'; return c2a(prop); } if(prop.split('px').length>1) { this._valueType = ‘px'; return [prop.split('px')[0]]; } } return [prop]; } Tween.prototype.setValue = function(prop) { if(this._valueType == ‘color')return a2c(prop); if(this._valueType == ‘px')return prop[0]+'px'; return prop; } Tween.prototype.start = function(startProps, endProps, timeSeconds, animType, delay) { if(animType != undefined)this._animType = this.animTypes[animType]; if(delay != undefined)this._delay = delay; // this._timeSeconds = timeSeconds; this._startTimer = new Date().getTime() + this._delay * 1000; // this._endProps = this.getValue(endProps); this._startProps = this.getValue(startProps); this._currentProps = []; // var $this = this; clearInterval(this._runID); this._runID = setInterval( function(){$this._run();} ,this._frame); } Tween.prototype.stop = function(state) { for(var i in this._startProps) { if(Number(state)>0) this._currentProps[i] = this._endProps[i]; else if(Number(state)<0) this._currentProps[i] = this._startProps[i]; } this.callListener(); this.complete(); // clearInterval(this._runID); } Tween.prototype.callListener = function() { this.run(this.setValue(this._currentProps)); } Tween.prototype._run = function() { if ( new Date().getTime()- this._startTimer< 0) return; var isEnd = false; // for(var i in this._startProps) { this._currentProps[i] = this._animType( new Date().getTime()-this._startTimer,Number(this._startProps[i]),Number(this._endProps[i])-Number(this._startProps[i]),this._timeSeconds * 1000); // if(this._startTimer + (this._timeSeconds * 1000) <= new Date().getTime()) { this._currentProps[i] = this._endProps[i]; isEnd = true; } } // if(isEnd)this.stop(); else this.callListener(); }
이 내용에 흥미가 있습니까?
현재 기사가 여러분의 문제를 해결하지 못하는 경우 AI 엔진은 머신러닝 분석(스마트 모델이 방금 만들어져 부정확한 경우가 있을 수 있음)을 통해 가장 유사한 기사를 추천합니다:
JS 판단 수조 네 가지 실현 방법 상세그러면 본고는 주로 몇 가지 판단 방식과 방식 판단의 원리를 바탕으로 문제가 있는지 토론하고자 한다. 예를 들어 html에 여러 개의 iframe 대상이 있으면 instanceof의 검증 결과가 기대에 부합되지 않을...
텍스트를 자유롭게 공유하거나 복사할 수 있습니다.하지만 이 문서의 URL은 참조 URL로 남겨 두십시오.
CC BY-SA 2.5, CC BY-SA 3.0 및 CC BY-SA 4.0에 따라 라이센스가 부여됩니다.
좋은 웹페이지 즐겨찾기
