似乎沒有效果,請大家指導一番
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>Document</title>
<style type="text/css">
body,div{
margin: 0;
padding: 0;
}
#div1{
width: 200px;
height: 200px;
background: red;
filter: alpha(opacity:30);
opacity: 0.3;
}
</style>
<script type="text/javascript">
window.onload(){
var oDiv = document.getElementById('div1');
oDiv.onmouseover = function(){
startMove(100);
}
oDiv.onmouseout = function(){
startMove(30);
}
}
var timer = null;
var alpha = 30;
function startMove(iTarget){
var oDiv = document.getElementById('div1');
clearInterval(timer);
timer = setInterval(function(){
var speed = 0;
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="div1"></div>
</body>
</html>
2019-03-08
js代碼寫在head里,你寫的是window.onload(){};寫錯了 應該是widow.onload=function(){}; 所有的js代碼寫在function里
2018-12-28
filter: alpha(opacity=30);
window.onload=function(){
}
oDiv.style.filter = 'alpha(opacity='+alpha+')';
javascript代碼寫在<head>里面:
由于這時候網(wǎng)頁主體(body)還未加載,所以這里適合放一些不是立即執(zhí)行的自定義函數(shù),立即執(zhí)行的語句則很可能會出錯(視瀏覽器而定)
javascript代碼寫在<body>里面:
這里可以放函數(shù)也可以放立即執(zhí)行的語句,但是如果需要和網(wǎng)頁元素互動的(比如獲取某個標簽的值或者給某個標簽賦值),Javascript代碼務必在標簽的后面
javascript代碼寫在<body>下面:
這時候整個網(wǎng)頁已經(jīng)加載完畢了,所以這里最適合放需要立即執(zhí)行的命令,而自定義函數(shù)之類的則不適合。