課程
/前端開發(fā)
/JavaScript
/JS動(dòng)畫效果
麻煩給一下
2016-03-29
源自:JS動(dòng)畫效果 5-1
正在回答
function startMove(obj,json,fn){ ? ?var flag = true; ? ?clearInterval(obj.timer); ? ?obj.timer = setInterval(function(){ ? ? ? ?for(var attr in json){ ? ? ? ? ? ?//取當(dāng)前值; ? ? ? ? ? ?var iCur = 0; ? ? ? ? ? ?if (attr=="opacity"){ ? ? ? ? ? ? ? ?iCur = Math.round(parseFloat(getStyle(obj,attr))*100); ? ? ? ? ? ?}else{ ? ? ? ? ? ? ? ?iCur = parseInt(getStyle(obj,attr)); ? ? ? ? ? ?} ? ? ? ? ? ?//算速度; ? ? ? ? ? ?var speed = (json[attr] - iCur)/8; ? ? ? ? ? ?speed = speed>0?Math.ceil(speed):Math.floor(speed);//取整; ? ? ? ? ? ?//檢測是否停止; ? ? ? ? ? ?if(iCur !== json[attr]) { ? ? ? ? ? ? ? ?flag = false; ? ? ? ? ? ?} ? ? ? ? ? ?if (attr=="opacity"){ ? ? ? ? ? ? ? ?obj.style.filter = 'alpha(opacity:"+(iCur+speed)+")'; ? ? ? ? ? ? ? ?obj.style.opacity = (iCur + speed)/100; ? ? ? ? ? ?}else{ ? ? ? ? ? ? ? ?obj.style[attr] = iCur + speed + "px"; ? ? ? ? ? ?} ? ? ? ? ? ?if (flag){ ? ? ? ? ? ? ? ?clearInterval(obj.timer); ? ? ? ? ? ? ? ?if (fn){ ? ? ? ? ? ? ? ? ? ?fn(); ? ? ? ? ? ? ? ?} ? ? ? ? ? ?} ? ? ? ?} ? ?},30);}//獲取樣式;function getStyle(obj,attr){ ? ?if (obj.currentStyle){ ? ? ? ?return obj.currentStyle[attr];//針對IE瀏覽器; ? ?}else{ ? ? ? ?return getComputedStyle(obj,false)[attr];//針對大多數(shù)瀏覽器; ? ?}}
聰明的湯姆
舉報(bào)
通過本課程JS動(dòng)畫的學(xué)習(xí),從簡單動(dòng)畫開始,逐步深入各種動(dòng)畫框架封裝
1 回答求move.js的源碼
3 回答老師,您好,能提供一些move.js的源碼么~~~~~
2 回答為什么距離瀏覽器邊框出來這么多?用的老師的move.js
1 回答這段代碼move.js 為什么沒辦法使用。哪里出錯(cuò)了?
1 回答美女老師你還開的有關(guān)于js的其它的課程沒有?
Copyright ? 2025 imooc.com All Rights Reserved | 京ICP備12003892號-11 京公網(wǎng)安備11010802030151號
購課補(bǔ)貼聯(lián)系客服咨詢優(yōu)惠詳情
慕課網(wǎng)APP您的移動(dòng)學(xué)習(xí)伙伴
掃描二維碼關(guān)注慕課網(wǎng)微信公眾號
2016-03-29
function startMove(obj,json,fn){
? ?var flag = true;
? ?clearInterval(obj.timer);
? ?obj.timer = setInterval(function(){
? ? ? ?for(var attr in json){
? ? ? ? ? ?//取當(dāng)前值;
? ? ? ? ? ?var iCur = 0;
? ? ? ? ? ?if (attr=="opacity"){
? ? ? ? ? ? ? ?iCur = Math.round(parseFloat(getStyle(obj,attr))*100);
? ? ? ? ? ?}else{
? ? ? ? ? ? ? ?iCur = parseInt(getStyle(obj,attr));
? ? ? ? ? ?}
? ? ? ? ? ?//算速度;
? ? ? ? ? ?var speed = (json[attr] - iCur)/8;
? ? ? ? ? ?speed = speed>0?Math.ceil(speed):Math.floor(speed);//取整;
? ? ? ? ? ?//檢測是否停止;
? ? ? ? ? ?if(iCur !== json[attr]) {
? ? ? ? ? ? ? ?flag = false;
? ? ? ? ? ?}
? ? ? ? ? ?if (attr=="opacity"){
? ? ? ? ? ? ? ?obj.style.filter = 'alpha(opacity:"+(iCur+speed)+")';
? ? ? ? ? ? ? ?obj.style.opacity = (iCur + speed)/100;
? ? ? ? ? ?}else{
? ? ? ? ? ? ? ?obj.style[attr] = iCur + speed + "px";
? ? ? ? ? ?}
? ? ? ? ? ?if (flag){
? ? ? ? ? ? ? ?clearInterval(obj.timer);
? ? ? ? ? ? ? ?if (fn){
? ? ? ? ? ? ? ? ? ?fn();
? ? ? ? ? ? ? ?}
? ? ? ? ? ?}
? ? ? ?}
? ?},30);
}
//獲取樣式;
function getStyle(obj,attr){
? ?if (obj.currentStyle){
? ? ? ?return obj.currentStyle[attr];//針對IE瀏覽器;
? ?}else{
? ? ? ?return getComputedStyle(obj,false)[attr];//針對大多數(shù)瀏覽器;
? ?}
}