<!DOCTYPE html><html><head><meta charset="utf-8"><meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1"><title>透明度</title><meta name="description" content=""><meta name="keywords" content=""><link href="" rel="stylesheet"><style> ???#div1{width:200px;height:200px;background: red;filter:alpha(opacity:30);opacity: 0.3;}</style><script> ???window.onload=function(){ ???????var oDiv=document.getElementById(‘div1‘); ???????oDiv.onmouseover=function(){ ???????????movestar(100); ???????} ???????oDiv.onmouseout=function(){ ???????????movestar(30); ???????} ???} ???var timer=null; ???var alpha=30; ???function movestar(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>js操作元素透明度以及浏览器兼容性
原文地址：http://www.cnblogs.com/itsmart/p/8047778.html