-
透明度的更改 window.onload=function(){ var oDiv=document.getElementById('div'); oDiv.onmouseover=function(){ startMove(100); } oDiv.onmouseout=function(){ startMove(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; oDiv.style.filter='alpha(opactiy:'+alpha')'; oDiv.style.opactiy=alpha/100; }; }) } }查看全部
-
JQuery動畫查看全部
-
//最終封裝的'完美移動框架' function startMove(obj,json,fn){ var flag=true;//標志所有運動是否到達目標值 clearInterval(obj.timer); obj.timer=setInterval(function(){ 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)); } //移動速度處理 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){ 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]; } }查看全部
-
跟智能社的一樣……查看全部
-
區別是:obj.style.width 是獲取的content區的寬度,并且只能獲取行內樣式;而offsetWidth獲取的是盒子寬度。 例如: <div class="d"></div> .d{ width:200px; height:200px; border:10px #ccc solid; padding:10px; background:red; } d.offsetWidth = 200(content區寬度) + 10X2(兩邊的padding) + 10X2(兩邊的border) = 240 友情贈送另外一個:clientWidth d.clientWidth = 200(content區寬度) + 10X2(兩邊的padding) = 220查看全部
-
獲取樣式,有兩種方法: 1、dom.style.xxx 這種寫法只能獲取行內樣式 例如 <div ></div> div.style.width能獲取到是200px,但是沒有出現在 引號中的樣式是獲取不到的 2、萬能方法。 getComputedStyle(div,null).xxx 這個是標準方法,需要做一下兼容 currentStyle 是IE的 3、友情贈送獲取任何樣式的代碼 1 2 3 4 5 6 7 function getStyle(obj,style){ if(obj.currentStyle){ return obj.currentStyle[style]; }else{ return getComputedStyle(obj,null)[style]; } }查看全部
-
JS取整函數: 1、向上取整:Math.floor(); 2、向下取整:Math.ceil();查看全部
-
多物體運動的所有屬性都不能公用查看全部
-
獲取樣式,有兩種方法: 1、dom.style.xxx 這種寫法只能獲取行內樣式 例如 <div ></div> div.style.width能獲取到是200px,但是沒有出現在 引號中的樣式是獲取不到的 2、萬能方法。 getComputedStyle(div,null).xxx 這個是標準方法,需要做一下兼容 currentStyle 是IE的 3、友情贈送獲取任何樣式的代碼 function getStyle(obj,style){ if(obj.currentStyle){ return obj.currentStyle[style]; }else{ return getComputedStyle(obj,null)[style]; } }查看全部
-
運動框架實現思路查看全部
-
ele.currentStyle[attribute]//chrome ele.getComputedStyle(obj, false)[attribute] //firfox查看全部
-
用getEventListeners(obj)獲取綁定在obj上的event查看全部
-
獲取對象的屬性用getComputedStyle(obj, attr)方法, 兼容IE用obj.currentStyle[attr]; 如下: function getStyle(obj, attr) { if (obj.currentStyle) {// IE return obj.currentStyle[attr]; }else {// Firefox chrome return getComputedStyle(obj, false)[attr]; } }查看全部
-
獲取樣式的值查看全部
-
$(function(){ $('#move a').mouseenter(function(){ $(this).find('i').animate({top:"200px",opacity:0},300,function(){ $(this).css({top:-200}); $(this).animate({top:"0px",opacity:100},200); }); }); });查看全部
舉報
0/150
提交
取消