第七色在线视频,2021少妇久久久久久久久久,亚洲欧洲精品成人久久av18,亚洲国产精品特色大片观看完整版,孙宇晨将参加特朗普的晚宴

為了賬號安全,請及時綁定郵箱和手機(jī)立即綁定

請慕友幫忙看看什么問題,出不來?

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en">

<head>

<meta http-equiv="Content-Type" content="text/html;charset=UTF-8">

<title>同時運動</title>

<style type="text/css">

ul{list-style: none;margin: 0;padding: 0;}

ul li{width: 200px;height: 100px;background: yellow;margin-bottom: 20px;border:4px solid #000;filter:alpha(opacity:30);opacity: 0.3;}

</style>


<script type="text/javascript">

window.onload=function(){

var oLi=document.getElementById('li1');

oLi.onmouseover=function(){

startMove(oLi,{width:201,height:200,opacity:100});

// startMove(oLi,'width',400);

// startMove(oLi,'height',200);

// 原來的運動框架不能滿足同時運動的效果,要用到JSON

}

oLi.onmouseout=function(){

startMove(oLi,{width:200,height:100,opacity:30});

}

}

// startMove(obj,{attr1:iTarget1,attr2:iTarget2},fn)

function startMove(obj,json,fn){

var flag=true;//假設(shè)所有運動都到達(dá)目標(biāo)值

clearInterval(obj.timer);//一開始要清除下定時器

obj.timer=setInterval(function(){//重新創(chuàng)建一個定時器

for(var attr in json){

//1.取當(dāng)前的值

var icur=0;

if(attr == 'opacity'){

icur=Math.round(parseFloat(getStyle(obj,attr))*100);//判斷當(dāng)前是不是透明度

}

else{

icur=parseInt(getStyle(obj,attr));

}

//2.算速度

var speed=(json[attr]-icur)/8;//速度值等于目標(biāo)值減去當(dāng)前寬度再除一個數(shù)字

speed=speed>0?Math.ceil(speed):Math.floor(speed);//只要是緩沖運動都要判斷

//3.檢測停止

if(icur != json[attr]){//如果當(dāng)前寬度等于目標(biāo)值清除定時器

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];

}

else{

return getComputedStyle(obj,false)[attr];

}

}

</script>

<!--<script type="text/javascript">

var json={a:12,b:13};

for(var i in json){

//alert(i);

alert(json[i]);

}

</script>-->

</head>

<body>

<ul>

<li id="li1"></li>

</ul>

</body>

</html>


正在回答

2 回答

調(diào)用函數(shù)的時候沒有參數(shù)fn

0 回復(fù) 有任何疑惑可以回復(fù)我~
看到了,謝謝
0 回復(fù) 有任何疑惑可以回復(fù)我~

舉報

0/150
提交
取消
JS動畫效果
  • 參與學(xué)習(xí)       113920    人
  • 解答問題       1487    個

通過本課程JS動畫的學(xué)習(xí),從簡單動畫開始,逐步深入各種動畫框架封裝

進(jìn)入課程

請慕友幫忙看看什么問題,出不來?

我要回答 關(guān)注問題
微信客服

購課補(bǔ)貼
聯(lián)系客服咨詢優(yōu)惠詳情

幫助反饋 APP下載

慕課網(wǎng)APP
您的移動學(xué)習(xí)伙伴

公眾號

掃描二維碼
關(guān)注慕課網(wǎng)微信公眾號