<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
"http://www.w3.org/TR/html4/loose.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>New Web Project</title>
<style>
#dd{
width:200px;
height:200px;
background:red;
opacity: 0.3;
}
</style>
<script>
window.onload=function(){
var oDiv=document.getElementById('dd');
var oBtn=document.getElementById('btn');
var timer=null;
var old=0.3;
var speed;
var speedValue=0.2;
function startMove(){
old+=speed;
if(old<=1&&old>=0.3)
{
oDiv.style.opacity=old;
}
else
{
if(old>1)
{
old=1;
oDiv.style.opacity=1;
}
else
{
old=0.3;
oDiv.style.opacity=0.3;
}
clearInterval(timer);
}
}
oDiv.onmouseover=function(){
clearInterval(timer);
speed=speedValue;
timer=setInterval(startMove,100);
};
oDiv.onmouseout=function(){
clearInterval(timer);
speed=-speedValue;
timer=setInterval(startMove,100);
};
};
</script>
</head>
<body>
<div id="dd"></div>
</body>
</html>
注意事项：
opactiy是firfox浏览器中的透明度设置，IE中是 filter:alpha(opactiy=30);
运行结果图：
原文：http://blog.csdn.net/u012193330/article/details/41348019
