aLi[i].timer=null;為什么谷歌會(huì)報(bào)錯(cuò),還有為什么我parseInt(getStyle(obj,'width'))可以執(zhí)行變化但是var了就不行。
<head>
<meta http-equiv="Content-Type" content="text/html; charset=gb2312" />
<title>無標(biāo)題文檔</title>
<style>
?body, ul,li{
? ? ? ? ? ?padding: 0;
? ? ? ? ? ?margin: 0;
? ? ? ?}
? ?ul,li
{
? ? ? ? ? ?list-style:none;
? ? ? ?}
? ? ? ul li
{
? ? ? ? ? ?width: 200px;
? ? ? ? ? ?height: 100px;
? ? ? ? ? ?background: yellow;
? ? ? ? ? ?margin-bottom: 20px;
? filter:alpha(opacity:30);
? opacity:0.3;
? ? ? ?}
</style>
<script>
window.onload=function(){
var aLi=document.getElementsByTagName('li');
? ? ? ?for(var i=0;i<=aLi.length;i++){
? ? ? ? ? ? aLi[i].timer=null;
? ?aLi[i].alpha=30;
? ?aLi[i].timer1=null;
? ?aLi[i].onmouseover=function()
?{
? ? ? ? ? ? ? ? ? ?startMove(this,400,100);
??
} ? ? ? ??
? ? ? ? ? aLi[i].onmouseout=function()
?{
? ? ? ? ? ? ? ? ? ?startMove(this,200,30);
} ? ? ? ? ? ??
}
}
function startMove(obj,iTarget,ikkk){
? ? ? ? ?clearInterval(obj.timer);
clearInterval(obj.timer1);
var dong=parseInt(getStyle(obj,'width'));
? ? ? ? ?obj.timer=setInterval(function(){
? ? ? ? ? ? ? ?var speed=(iTarget -parseInt(getStyle(obj,'width')) )/8;/*實(shí)現(xiàn)緩沖運(yùn)動(dòng)*/
? ? ? ? ? ? ? ?speed=speed>0?Math.ceil(speed):Math.floor(speed);
? ? ? if(parseInt(getStyle(obj,'width'))==iTarget)
? ? ? ? ? ? ? ?{
? ? ? ? ? ? ? ? ? ?clearInterval(obj.timer);
? ? ? ? ? ? ? ?}
? ? ? ? ? ? ? ?else{
? ? ? ? ? ? ? ? ? ?obj.style.width=parseInt(getStyle(obj,'width'))+speed+'px';
? ? ? ? ? ? ? ?
? ? ? ? ? ?}}
? ,30)
/* ?
obj.timer1=setInterval(function(){
? ? var speed;
if(obj.alpha>ikkk){
speed=-10; }
else{
? ? speed=10;
}if (obj.alpha==ikkk){
clearInterval(obj.timer1);
}
else{
obj.alpha+=speed;
obj.style.filter='alpha(opacity:'+obj.alpha+')';
obj.style.opacity=obj.alpha/100;}
},30)
?
}*/
}
? ? ?//獲取CSS屬性,直接offsetWidth會(huì)加上border屬性。 ?
function getStyle(obj,attr){
if(obj.currentStyle)
{return obj.currentStyle[attr];//ie?
}
?else
?{return getComputedStyle(obj,false)[attr];}
}
?
?
?
??
??
</script>
</head>
<body>
<ul>
? ?<li></li>
? ?<li></li>
? ?<li></li>
</ul>
</body>
</html>
2017-06-09
i < ali.length? 不是<=? 長度只有3? 你卻賦了4次值? 要仔細(xì)
2016-10-26
就是當(dāng)我用var dong=parseInt(getStyle(obj,'width'))進(jìn)行替換時(shí),特效就沒用了。很奇怪