標籤：style blog http 使用 width io
基本思路：使用樣式filter，但是要區分IE瀏覽器和chrom、firefox的不同，具體也是用定時器來實現。
<!DOCTYPE HTML><!----><html><head><meta charset="utf-8"><title></title><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 (){startMove(100);};oDiv.onmouseout=function (){startMove(30);};};var alpha=30;//透明度變數，因為樣式那裡初始是30var timer=null;function startMove(iTarget){var oDiv=document.getElementById('div1');clearInterval(timer);timer=setInterval(function (){var speed=0;if(alpha<iTarget){speed=1;}else{speed=-1;}if(alpha==iTarget){clearInterval(timer);}else{alpha+=speed;oDiv.style.filter='alpha(opacity:'+alpha+')';//IE的透明度oDiv.style.opacity=alpha/100;//Google、Firefox瀏覽器，滿的值是1，不是100，因此除以100}},30)}</script></head><body> <div id="div1"></div></body></html>
：
Start building with 50+ products and up to 12 months usage for Elastic Compute Service
1 on 1 presale consultation
24/7 Technical Support 6 Free Tickets per Quarter Faster Response
Alibaba Cloud offers highly flexible support services tailored to meet your exact needs.
A comprehensive suite of global cloud computing services to power your business
Payment Methods We Support
