网页文字特效代码:逐渐变色的文字效果_引导线--|IT资讯|网页制作|网页设计|平面设计|网站优化

网页文字特效代码:逐渐变色的文字效果

引导线网页制作网提示您：网页文字特效代码:逐渐变色的文字效果

网页文字特效代码:逐渐变色的文字效果

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="http://www.w3.org/1999/xhtml"> <head> <FCK:meta http-equiv="Content-Type" content="text/html; charset=gb2312" /> <title>逐渐变色的字</title> <style> .box{ position:relative; width:1000px; } .comm{ font-size:60px; color:#ddd; font-family:黑体; position: absolute; top:0; left:0; } .red{ color: #0000FF; width: 0; overflow: hidden; white-space: nowrap; z-index: 10; }; </style> </head> <body> <div class="box"> <strong id="Title" class="comm">引导线www.yindaoxian.com</strong> </div> <script> function getStyle( elem, name ) { if (elem.style[name]) return elem.style[name]; else if (elem.currentStyle) return elem.currentStyle[name]; else if (document.defaultView && document.defaultView.getComputedStyle) { name = name.replace(/([A-Z])/g,"-$1"); name = name.toLowerCase(); var s = document.defaultView.getComputedStyle(elem,""); return s && s.getPropertyValue(name);} else return null; } (function(){ var lb = document.getElementById("Title"), lt = lb.cloneNode(true), i = 0, sw = parseInt(getStyle(lb,'width')); lt.setAttribute('id',lb.getAttribute('id')+'1'); lt.className = 'comm red'; lb.parentNode.appendChild(lt); window.sliderFont = setInterval(function(){ parseInt(getStyle(lt,'width')) >= sw ? clearInterval(window.sliderFont) : lt.style['width'] = i++ + 'px'; },10); })(); </script> </body> </html>
[Ctrl+A 全部选择提示：你可先修改部分代码，再按运行]

文章由引导线网页制作网整理发布！欢迎大家转载！

引导线

网页文字特效代码:逐渐变色的文字效果

Tag：文字效果特效代码逐渐变色网页文字特效