标签：
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd"> <html> <head> <meta http-equiv="Content-Type" content="text/html; charset=utf-8"> <title>text-shadow</title> <style type="text/css"> body{ background:#000; font-weight:bold; font-family:微软雅黑;} span{transition:1s all ease; text-shadow:0 0 100px #fff; color:rgba(255,255,255,0); opacity:0; } span.on{ text-shadow:0 0 0px #fff; opacity:1;} </style> <script type="text/javascript"> window.onload = function() { var str = "APEC会议结束后，美国总统奥巴马对中国进行国事访问。11日至12日，从中南海瀛台夜话至人民大会堂的正式会谈，日程满满、内容丰富。昨天，人民日报微信公众号刊发《习大大奥巴马在瀛台，到底聊了什么》，披露了包括习奥瀛台会晤的话题及一些现场轶事。文中提到，习大大与奥巴马就中美两国关系进行深入交流，在中国经济、中国改革、中国依法治国、人权和主权等问题进行了精彩谈话。"; for(var i = 0; i < str.length; i++) { var oSpan = document.createElement("span"); oSpan.innerHTML = str.charAt(i); document.body.appendChild(oSpan); } var i = 0; var aSpan = document.body.children; timer = setInterval(function() { aSpan[i].className = "on"; i++; if(i == aSpan.length) { clearInterval(timer); } }, 100); }; </script> </head> <body> </body> </html>
注意span的color和opacity属性，如果把color改成color:#fff，就没有这种效果了，如果把span中的opacity:0去掉的话，它的效果也差远了。注意这些细节！！！
标签：
原文地址：http://www.cnblogs.com/king-bj/p/4500490.html
