-
var timer=null; function startMove(iTarget){ var oDiv=document.getElementById('div1'); clearInterval(timer); timer=setInterval(function(){ var speed=(iTarget-oDiv.offsetLeft)/10;//除法會使數值出現小數點,凡是操作速度的,就要做取整,不然會出問題 ////如果speed大于0向下取整,如果speed小于0向上取整 .2ceil2 1.2floor2 speed=speed>0?Math.ceil(speed):Math.floor(speed); if(oDiv.offsetLeft==iTarget){ clearInterval(timer); }else{ oDiv.style.left=oDiv.offsetLeft+speed+'px'; } },30); }查看全部
-
<script> window.onload=function(){ var oDiv=document.getElementById('div1'); //移入透明度100 oDiv.onmouseover=function(){ startMove(100); } //移出透明度30 oDiv.onmouseout=function(){ startMove(30); } } /** * [startMove description] * @param {[type]} iTarget [description] * @return {[type]} [description] */ //聲明定時器 var timer=null; //聲明透明度變量 var alpha=30; function startMove(iTarget){ var oDiv=document.getElementById('div1'); //清除定時器 clearInterval(timer); //實例化定時器 timer=setInterval(function(){ var speed=0; if(alpha>iTarget){ speed=-10; }else{ speed=10; }; //判斷如果 if(alpha==iTarget){ clearInterval(timer); }else{ alpha+=speed; //ie oDiv.style.filter='alpha(opacity:'+alpha+')'; //firefox .. oDiv.style.opacity=alpha/100; } },30); }查看全部
-
var timer=null; var alpha=30; function startMove(iTarget){ var oDiv=document.getElementById('div1'); clearInterval(timer); timer=setInterval(function(){ var speed=0; if (alpha>iTarget) { speed=-10; }else{ speed=10; }; if (alpha==iTarget) { clearInterval(timer); }else{ alpha+=speed; //ie oDiv.style.filter='alpha(opacity:'+alpha+')'; oDiv.style.opacity=alpha/100; }; },30); }查看全部
-
/*1.3精簡參數, iTarget:偏移目標值 用當前offsetLeft的值與傳入的目標值來判斷增加和減少 */ function startMove(iTarget){ clearInterval(timer); var oDiv=document.getElementById('div1'); timer= setInterval(function(){ var speed=0; //如果當前值大于目標就是正向運動 if(oDiv.offsetLeft > iTarget){ speed=-10; }else{ //如果小于目標值就是反向運動 speed=10; }; if(oDiv.offsetLeft==iTarget){ clearInterval(timer); }else{ oDiv.style.left=oDiv.offsetLeft+speed+'px'; } }, 30); }查看全部
-
/*1.2封裝移入移出, speed:速度 iTarget:偏移目標 */ // function startMove(speed,iTarget){ // clearInterval(timer); // var oDiv=document.getElementById('div1'); // timer= setInterval(function(){ // if(oDiv.offsetLeft==iTarget){ // clearInterval(timer); // }else{ // oDiv.style.left=oDiv.offsetLeft+speed+'px'; // } // }, 30); // }查看全部
-
//1.1移入 // function startMove(){ // clearInterval(timer); // var oDiv=document.getElementById('div1'); // timer= setInterval(function(){ // if(oDiv.offsetLeft==0){ // clearInterval(timer); // }else{ // oDiv.style.left=oDiv.offsetLeft+1+'px'; // } // }, 30); // }查看全部
-
//1.1移出 // function startMove1(){ // //防止重復啟動定時器,進入方法先關閉所有定時器 // clearInterval(timer); // var oDiv=document.getElementById('div1'); // timer= setInterval(function(){ // if(oDiv.offsetLeft==-200){ // clearInterval(timer); // }else{ // oDiv.style.left=oDiv.offsetLeft-1+'px'; // } // }, 30); // }查看全部
-
domObj.offsetWidth為width + paddingLeft + paddingRight + borderLeft + borderRight查看全部
-
運動框架實現思路查看全部
-
getStyle obj.currentStyle[attr] IE getComputedStyle(obj,false)[attr] firefox查看全部
-
ceil()向上取整查看全部
-
阻止事件冒泡event.stopPropagation ? event.stopPropagation() : event.cancelBubble = true;查看全部
-
圖標字體,你可以到http://www.iconfont.cn/去免費下載,下載時候有demo會告訴你怎么用的。查看全部
-
前端網 http://www.w3cfuns.com/forum-51-1.html查看全部
-
getstyle解決一個bug查看全部
舉報
0/150
提交
取消