javascript運動的小框架
阿新 • • 發佈:2017-10-15
運動框架
寫一個運動小框架
1、需要獲取元素對象
document.getElementById();
2、需要在函數裏面回去樣式值
function Css(obj,attr){ if(obj.currentStyle){ return obj.currentStyle[arr]; }else{ return getComputedStyle(obj,false)[arr]; } }
3、寫一個定時器函數
obj.iTmer = setInterval(fn,30);
4、運動函數
function fn(){ var iTmer = null; iSpeed = parseInt(getCss(objDid,‘left‘))>end?-iSpeed:iSpeed; obj.iTmer = setInterval(fn,30); var dir = null; if(arr == ‘opacity‘){ dir = Math.round(getCss(obj,arr)*100) + iSpeed; if ( dir > end && iSpeed > 0 || dir < end && iSpeed < 0) { dir = end; } obj.style[arr] = (dir + iSpeed) / 100; obj.style.filter = ‘alpha(opacity=‘+ (dir + iSpeed) +‘)‘; }else{ dir = parseInt(getCss(obj,arr)) + iSpeed; if ( dir > end && iSpeed > 0 || dir < end && iSpeed < 0) { dir = end; } obj.style[arr] = dir + ‘px‘; } if ( dir == end ) { clearInterval( obj.iTmer ); } }
javascript運動的小框架