席浅
2016-11-26 20:29
<!DOCTYPE HTML>
<html>
<head>
<meta http-equiv="Content-Type";content="text/html";charset="utf-8"/>
<title>透明度的改变</title>
<style type="text/css">
*{
margin:0;
padding:0;
}
#did{
width:200px;
height:200px;
background:red;
filter:alpha(opacity:30);
opacity:0.3;
margin:auto;
}
</style>
<script type="text/JavaScript">
window.load=function(){
var oDiv = document.getElementById("did");
oDiv.onmouseover=function(){
startChange(100);
}
oDiv.onmouseout=function(){
startChange(30);
}
}
var timer = null;
var speed = 0;
var alpha = 30;
function startChange(itarget){
var oDiv = document.getElementById("did");
clearInterval(timer);
timer = serInterval(function(){
if(alpha>itarget){
speed = -10;
}
else{
speed = 10;
}
if(alpha == itarget){
clearInterval(timer);
}
else{
alpha += speed;
oDiv.style.filter = 'alpha(opacity:'+alpha+')';
oDiv.style.opacity = alpha/100;
}
},30)
}
</script>
</head>
<body>
<div id="did"></div>
</body>
</html>找了好久的错误,都没有找到,眼已瞎,求大神看看!1
1、window.onload写错
2、setInterval写错
JS动画效果
113910 学习 · 1502 问题
相似问题