定时器对DIV透明度的转换，为什么有BUG？求解，谢谢
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>淡入，淡出</title>
</head>
<body>
<div id="fade-obj" style="width:300px;height:300px;background:#000"></div>
<button id="fade-btn">淡出</button>
<script>
var obj=document.getElementById("fade-obj");
var btn=document.getElementById("fade-btn");
//Chrom获取外联样式
var opa=Number(getComputedStyle(obj, null).opacity);;
// IE浏览器获取外联样式
// var op = Number(fadeObj.currentStyle.opacity);
console.log(opa);
var timer,timer1;
btn.onclick=function(){
if(btn.textContent=="淡出"){
btn.textContent="淡入"
out();
}else if(btn.textContent=="淡入"){
btn.textContent="淡出";
In();
}
}
function out(){
opa-=.1;
btn.disabled=true;
timer=setInterval(out,200);
obj.style.opacity=opa.toString();
if(opa<0){
clearInterval(timer);
btn.disabled=false;
}
}
function In(){
opa+=.1;
btn.disabled=true;
timer1=setInterval(In,200);
obj.style.opacity=opa.toString();
if(opa>1){
clearInterval(timer1);
btn.disabled=false;
}
}
</script>
</body>
</html>
毛Bing1回答
随时随地看视频慕课网APP
相关分类
JavaScript