窗口渐显
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html id="jianxian" xmlns="http://www.w3.org/1999/xhtml"> <head> <meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> <title>窗口渐显效果</title> <script type="text/javascript"> document.writeln("<style type=\"text/css\">"); document.writeln("#jianxian{opacity:0; background:#fff;}"); document.writeln("</style>"); window.onload = function() { var cont = document.getElementById("jianxian"); var i = 0; var flag = false; var isIE = navigator.userAgent.toLowerCase().match(/msie ([\d.]+)/),//判断是否为IE flag = setInterval ( function() { if(!isIE) { if(i <= 1) { cont.style.opacity = (i += 0.01); } else { clearInterval(flag); } } else { if(i <= 100) { cont.style.filter = "alpha(opacity=" + (i += 1) + ")"; } else { clearInterval(flag); } } },10 ); } </script> </head> <body> <html id="jianxian"> </body> </html>
JS文件: