-
currentStyle針對(duì)IE瀏覽器； getComputedStyle 針對(duì)Firefox瀏覽器查看全部
-
alpha += speed; 即alpha = alpha + speed;查看全部
-
setInterval查看全部
-
IE瀏覽器filter:alpha(opacity=30); 其他的opacity:0.3;查看全部
-
同時(shí)執(zhí)行兩個(gè)定時(shí)器函數(shù)，后一個(gè)函數(shù)執(zhí)行時(shí)會(huì)清除前一個(gè)函數(shù)的定時(shí)器， 所以實(shí)際效果是只執(zhí)行后一個(gè)函數(shù)查看全部
-
設(shè)置一個(gè)回調(diào)參數(shù)，如果在執(zhí)行第一個(gè)參數(shù)完成之后沒(méi)有第二個(gè)要執(zhí)行的，就結(jié)束動(dòng)作，反之，則進(jìn)行下一步查看全部
-
獲取樣式 getStyle(obj,attr){ if(obj.currentStyle){ return obj.currentStyle[attr];//針對(duì)IE瀏覽器 } else{ return getComputeedStyle(obj,false)[attr];針對(duì)firefox瀏覽器 } }查看全部
-
function startMove(obj, json, fn) { clearInterval(obj.timer); obj.timer = setInterval(function() { var flag = true;//標(biāo)志所有運(yùn)動(dòng)是否到達(dá)目標(biāo)值-----必須放在計(jì)時(shí)器里面(才能滿足判斷所有運(yùn)動(dòng)是否到達(dá)目標(biāo)值) for(var attr in json) { var curr = 0; if(attr == 'opacity') { curr = Math.round(parseFloat(getStyle(obj, attr)) * 100); } else { curr = parseInt(getStyle(obj, attr)); } //移動(dòng)速度處理 var speed = 0; speed = (json[attr] - curr) / 10; speed = speed > 0 ? Math.ceil(speed) : Math.floor(speed); if(curr != json[attr]) { flag = false; } if(attr == 'opacity') { obj.style.filter = 'alpha(opacity:' + (curr + speed) + ")"; obj.style.opacity = (curr + speed) / 100; } else { obj.style[attr] = curr + speed + 'px'; } } if(flag) { //alert('ok'); clearInterval(obj.timer); if(fn) { fu(); } } }, 30); } function getStyle(obj, attr) { if(obj.currentStyle) { //IE取樣式 return obj.currentStyle[attr]; } else { return getComputedStyle(obj, false)[attr]; } }查看全部
-
getStyle parseFloat查看全部
-
由于計(jì)算機(jī)不能很精確的存儲(chǔ)浮點(diǎn)數(shù)，使用parseFloat時(shí)，有時(shí)會(huì)出現(xiàn)一堆小數(shù)。 解決：Math.round()四舍五入查看全部
-
當(dāng)多物體運(yùn)動(dòng)時(shí)候，所有的參數(shù)都不能公用，像timer，或者alpha查看全部
-
修改行內(nèi)樣式查看全部
-
獲取樣式通過(guò)getStyle（obj，attribute）進(jìn)行，這是一個(gè)封裝好的函數(shù)查看全部
-
JS中 obj.style.attr 只能獲取行內(nèi)樣式 要獲取非行內(nèi)樣式要通過(guò)obj.currentStyle[attr]或者getComputedStyle(obj,false)[attr]方法獲取 可以封裝為function getStyle(obj,attr){ if(obj.currentStyle){return obj.currentStyle[attr];}else{returngetComputedStyle(obj,false)[attr]}} obj.offsetWidth 返回值是數(shù)值所以不用parseInt（）；而obj.style.width獲取的是像素值查看全部
-
取整原因：因?yàn)橛谐?，?dāng)offsetLeft值變的越來(lái)越小時(shí)，最后相除會(huì)使speed變成小數(shù)，從而offsetLeft與speed相加會(huì)有小數(shù)，又因顯示器的最小像素單位是1px，所以瀏覽器默認(rèn)向下取整（變小，即floor），將小數(shù)省略，小數(shù)省略后，最終的值會(huì)變小，從而導(dǎo)致程序無(wú)法進(jìn)入if判斷，進(jìn)入死循環(huán)。 這一點(diǎn)可以用console.log(speed)可以驗(yàn)證，speed的log會(huì)一直輸出，因?yàn)槌绦蛩姥h(huán)了查看全部
舉報(bào)
0/150
提交
取消