求大神幫忙看看,為什么div的顏色沒有變化
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<title>Insert title here</title>
<style>
body,div{
?? ?margin = 0;
?? ?padding = 0;
}
div{
?? ?height: 200px;
?? ?width: 200px;
?? ?margin: 20px;
?? ?float: left;
?? ?background: red;
?? ?filter:alpha(opacity:20); /* IE瀏覽器 */
?? ?opacity:0.2;? /* 火狐瀏覽器 */
}
</style>
<script type="text/javascript">
window.onload = function(){
?? ?var oDiv = document.getElementsByTagName("div");
?? ?for(var i = 0; i < oDiv.Length; i++){
?? ??? ?oDiv[i].alpha = 30;
?? ??? ?oDiv[i].timer = null;
?? ??? ?oDiv[i].onmouseover = function(){
?? ??? ??? ?startmove(this,100);
?? ??? ?}
?? ??? ?oDiv[i].onmouseout = function(){
?? ??? ??? ?startmove(this,30);
?? ??? ?}
?? ?}
}
//var timer = null;
//var alpha = 30;
function startmove(obj,iTarger){
?? ?//var oDiv = document.getElementById("div1");
?? ?clearInterval(obj.timer);
?? ?obj.timer = setInterval(function(){
?? ??? ?var speed = 0;
?? ??? ?if (obj.alpha > iTarger){
?? ??? ??? ?speed = -10;
?? ??? ?}
?? ??? ?else{
?? ??? ??? ?speed =10;
?? ??? ?}
?? ??? ?if(obj.alpha == iTarger){
?? ??? ??? ?clearInterval(obj.timer);
?? ??? ?}
?? ??? ?else
?? ??? ?{
?? ??? ??? ?obj.alpha = obj.alpha + speed;
?? ??? ??? ?obj.style.filter = 'alpha(opacity:'+obj.alpha+')';
?? ??? ??? ?obj.style.opacity = obj.alpha/100;
?? ??? ?}
?? ?}
?? ??? ??? ?,30);
}
</script>
</head>
<body>
<div id = div1></div>
<div id = div2></div>
<div id = div3></div>
</body>
</html>
2018-09-26
obj.style.filter = 'alpha(opacity:'+obj.alpha+')';
這句錯(cuò)了,應(yīng)該是obj.style.filter = 'obj.alpha(opacity:'+obj.alpha+')';
2018-06-01
for(var i = 0; i < oDiv.Length; i++)?這句里面的oDiv.Length應(yīng)該改為oDiv.length.此處應(yīng)是小寫的l.
2017-10-21
把Length的L小寫