爱易网
IT新闻
IT新闻
爱易资讯
网站搭建
云虚拟主机教程
云服务器教程
Apache教程
IIS教程
Nginx教程
网站策划
站长文章
推广教程
淘宝客教程
网页设计
HTML教程
XHTML教程
CSS教程
HTML5教程
CSS3教程
JavaSript基础
JQuery教程
Node.js教程
前端技术
Ajax教程
Js特效
Xml教程
平面设计
页面UI设计
photoshop教程
程序开发
AI人工智能
Asp教程
Php教程
Asp.Net教程
Net Core教程
C#教程
Java教程
Jsp教程
开发技术
微信小程序教程
Uniapp开发教程
微信公众号开发
Andriod教程
IOS教程
DOS教程
Python教程
Docker教程
Windows Container教程
数据库
MSSQL教程
MySQL教程
Redis教程
Access教程
Oracle教程
数据库教程
操作系统
Linux教程
Windows教程
MAC教程
Cisco教程
交换机教程
防火墙教程
搜索
爱易网页
JS特效
变色的动态文字
变色的动态文字
日期:2014-05-18 浏览次数:20133 次
欢迎光临爱易网网页脚本特效中心,点击运行按钮演示特效:
以下是程序代码
脚本说明: 第一步:把如下代码加入<body>区域中 <div id="fader" style="position:absolute; top:35px; left:50px; width:600px; text-align:center;"></div> <SCRIPT LANGUAGE="JavaScript"> <!-- Begin var texts = new Array( "<font size='+2' color='{COLOR}' face='Arial'><strong>1stscript</strong></font>", "<font size='+3' color='{COLOR}' face='Arial'><strong>J a v a s c r i p t</strong></font>", "<font size='+4' color='{COLOR}' face='Arial'><strong>F l a s h</strong></font>", "<font size='+3' color='{COLOR}' face='Arial'><strong>A s p</font>", "<a href='http://www.1stscript.com' target='_top'><font size='+3' color='{COLOR}' face='Arial'><strong>W e l c o m e </strong></font></a>"); var bgcolor = "#000000"; // background color, must be valid browser hex color (not color names) var fcolor = "#FF8000"; // foreground or font color var steps = 20; // number of steps to fade var show = 500; // milliseconds to display message var sleep = 30; // milliseconds to pause inbetween messages var loop = true; // true = continue to display messages, false = stop at last message // Do Not Edit Below This Line var colors = new Array(steps); getFadeColors(bgcolor,fcolor,colors); var color = 0; var text = 0; var step = 1; // fade: magic fader function function fade() { // insert fader color into message var text_out = texts[text].replace("{COLOR}", colors[color]); // texts should be defined in user script, e.g.: var texts = new Array("<font color='{COLOR}' sized='+3' face='Arial'>howdy</font>"); // actually write message to document if (document.all) fader.innerHTML = text_out; // document.all = IE only if (document.layers) { document.fader.document.write(text_out); document.fader.document.close(); } // document.layers = Netscape only // select next fader color color += step; // completely faded in? if (color >= colors.length-1) { step = -1; // traverse colors array backward to fade out // stop at last message if loop=false if (!loop && text >= texts.length-1) return; // loop should be defined in user script, e.g.: var loop=true; } // completely faded out? if (color == 0) { step = 1; // traverse colors array forward to fade in again // select next message text += 1; if (text == texts.length) text = 0; // loop back to first message } // subtle timing logic... setTimeout("fade()", (color == colors.length-2 && step == -1) ? show : ((color == 1 && step == 1) ? sleep : 50)); // sleep and show should be defined in user script, e.g.: var sleep=30; var show=500; } // getFadeColors: fills Colors (predefined Array) // with color hex strings fading from ColorA to ColorB // note: Colors.length equals the number of steps to fade function getFadeColors(ColorA, ColorB, Colors) { len = Colors.length; // strip '#' signs if present if (ColorA.charAt(0)=='#') ColorA = ColorA.substring(1); if (ColorB.charAt(0)=='#') ColorB = ColorB.substring(1); // substract rgb compents from hex string var r = HexToInt(ColorA.substring(0,2)); var g = HexToInt(ColorA.substring(2,4)); var b = HexToInt(ColorA.substring(4,6)); var r2 = HexToInt(ColorB.substring(0,2)); var g2 = HexToInt(ColorB.substring(2,4)); var b2 = HexToInt(ColorB.substring(4,6)); // calculate size of step for each color component var rStep = Math.round((r2 - r) / len); var gStep = Math.round((g2 - g) / len); var bStep = Math.round((b2 - b) / len); // fill Colors array with fader colors for (i = 0; i < len-1; i++) { Colors[i] = "#" + IntToHex(r) + IntToHex(g) + IntToHex(b); r += rStep; g += gStep; b += bStep; } Colors[len-1] = ColorB; // make sure we finish exactly at ColorB } // I</div></div> <div class="clearfix"></div> </div> <nav aria-label="..."> <ul class="pager"> <li class="previous"><a href="4667">上一篇:狡猾的按钮特效</a></li> <li class="next"><a href="1935">下一篇:内容显示隐藏效果</a></li> </ul> </nav> <div class="alert alert-warning" role="alert"> <strong>免责声明:</strong> 本文仅代表作者个人观点,与爱易网无关。其原创性以及文中陈述文字和内容未经本站证实,对本文以及其中全部或者部分内容、文字的真实性、完整性、及时性本站不作任何保证或承诺,请读者仅作参考,并请自行核实相关内容。 </div> <div class="panel panel-default"> <div class="panel-heading"> <h3 class="panel-title">相关资料<span><a target="_blank" class="pull-right" href="/ItNews/">更多></a></span></h3> </div> <div class="panel-body row"> <ol> <div class="col-md-6 col-xs-12"> <li class="articleAbout"><a href='/ItNews/34149' title='地图导航骤起杀机 百度高德重新定义商业模式' target="_blank"> 地图导航骤起杀机 百度高德重新定义商业模式</a></li></div> <div class="col-md-6 col-xs-12"> <li class="articleAbout"><a href='/ItNews/34101' title='火狐手机发展前路:或被运营商绑架' target="_blank"> 火狐手机发展前路:或被运营商绑架</a></li></div> <div class="col-md-6 col-xs-12"> <li class="articleAbout"><a href='/ItNews/6915' title='固话上网卡或将实名制 运营商泄露用户信息将被罚' target="_blank"> 固话上网卡或将实名制 运营商泄露用户信息将被罚</a></li></div> <div class="col-md-6 col-xs-12"> <li class="articleAbout"><a href='/ItNews/34135' title='新一代iPhone11月底国内上市 支持TD制式' target="_blank"> 新一代iPhone11月底国内上市 支持TD制式</a></li></div> <div class="col-md-6 col-xs-12"> <li class="articleAbout"><a href='/ItNews/34291' title='OPPO Find7体验测 Find7综测' target="_blank"> OPPO Find7体验测 Find7综测</a></li></div> <div class="col-md-6 col-xs-12"> <li class="articleAbout"><a href='/ItNews/34311' title='微软大幅调整Bing在华策略:从高大上到接地气' target="_blank"> 微软大幅调整Bing在华策略:从高大上到接地气</a></li></div> <div class="col-md-6 col-xs-12"> <li class="articleAbout"><a href='/ItNews/34289' title='阿里巴巴上市后雅虎将面临更大的业绩压力' target="_blank"> 阿里巴巴上市后雅虎将面临更大的业绩压力</a></li></div> <div class="col-md-6 col-xs-12"> <li class="articleAbout"><a href='/ItNews/34343' title='易迅大众点评缩水执行“七天后悔权”被约谈' target="_blank"> 易迅大众点评缩水执行“七天后悔权”被约谈</a></li></div> <div class="col-md-6 col-xs-12"> <li class="articleAbout"><a href='/ItNews/34211' title='三星石墨烯制备技术获突破' target="_blank"> 三星石墨烯制备技术获突破</a></li></div> </ol> </div> </div> </div> <div class="col-lg-4 hidden-sm hidden-xs"> <!--右边的内容--> <a id="AdPageRight1_AdPageRight" href="http://www.tdyun.com/host/?aiyiweb" target="_blank"><img class="img-responsive" src="/images/TdPageAd/host.png" alt="香港全能空间 香港高速云虚拟主机PHP/ASP/NET送MSSQL和MYSQL" /></a> <script src='/Scripts/AdContentPage300_1.js' language='javascript'></script> <script src='/Scripts/AdContentPage300_2.js' language='javascript'></script> <script src='/Scripts/AdContentPage300_3.js' language='javascript'></script> <div class="panel panel-default"> <div class="panel-heading"> <h3 class="panel-title">推荐阅读<span><a target="_blank" class="pull-right" href="/ItNews/">更多></a></span></h3> </div> <div class="panel-body"> <ol> <li class="articleAbout"><a href=/ItNews/6891 title='互联网情色众多 Facebook与9158态度大不同' target="_blank"> 互联网情色众多 Facebook与9158态度大不同</a></li> <li class="articleAbout"><a href=/ItNews/34158 title='黑莓高管:黑莓能作为家“小众公司”活下来' target="_blank"> 黑莓高管:黑莓能作为家“小众公司”活下来</a></li> <li class="articleAbout"><a href=/ItNews/6903 title='联想架构调整后:Think品牌或推智能手机' target="_blank"> 联想架构调整后:Think品牌或推智能手机</a></li> <li class="articleAbout"><a href=/ItNews/34365 title='特斯拉技术专利开放,要革自己的命?' target="_blank"> 特斯拉技术专利开放,要革自己的命?</a></li> <li class="articleAbout"><a href=/ItNews/10820 title='从3G牌照发放看中国4G规划效果 ' target="_blank"> 从3G牌照发放看中国4G规划效果 </a></li> <li class="articleAbout"><a href=/ItNews/6916 title='第二梯队也PK:当1号店“遇上”京东手机节' target="_blank"> 第二梯队也PK:当1号店“遇上”京东手机节</a></li> <li class="articleAbout"><a href=/ItNews/6912 title='网络音乐非片面收费 高晓松时间表难完成' target="_blank"> 网络音乐非片面收费 高晓松时间表难完成</a></li> <li class="articleAbout"><a href=/ItNews/16169 title='网友爆料称微软雇水军宣传主机Xbox One' target="_blank"> 网友爆料称微软雇水军宣传主机Xbox One</a></li> <li class="articleAbout"><a href=/ItNews/439 title='工商下月将整治手机市场' target="_blank"> 工商下月将整治手机市场</a></li> <li class="articleAbout"><a href=/ItNews/34192 title='英特尔承认,联想最新K系列智能手机放弃英特尔处理器' target="_blank"> 英特尔承认,联想最新K系列智能手机放弃英特尔处理器</a></li> <li class="articleAbout"><a href=/ItNews/34381 title='谁说黑莓没救?他们在悄悄地深耕企业级市场,在这个领域,苹果三星算什么,他们远远不是黑莓的对手' target="_blank"> 谁说黑莓没救?他们在悄悄地深耕企业级市场,在这个领域,苹果三星算什么,他们远远不是黑莓的对手</a></li> <li class="articleAbout"><a href=/ItNews/6849 title='传诺基亚Lumia928下月推出 将与iPhone5看齐' target="_blank"> 传诺基亚Lumia928下月推出 将与iPhone5看齐</a></li> <li class="articleAbout"><a href=/ItNews/34405 title='小米年度发布会遭围剿!多款新品难阻品牌危机' target="_blank"> 小米年度发布会遭围剿!多款新品难阻品牌危机</a></li> <li class="articleAbout"><a href=/ItNews/34197 title='苹果已经允许开发者提交64位应用程序' target="_blank"> 苹果已经允许开发者提交64位应用程序</a></li> <li class="articleAbout"><a href=/ItNews/34107 title='“宽带中国”计划已正式上升为国家战略' target="_blank"> “宽带中国”计划已正式上升为国家战略</a></li> <li class="articleAbout"><a href=/ItNews/34151 title='京东封杀财付通:终极目标是电商生态圈' target="_blank"> 京东封杀财付通:终极目标是电商生态圈</a></li> <li class="articleAbout"><a href=/ItNews/6852 title='前苹果顾问批判iPhone命名:不应加S' target="_blank"> 前苹果顾问批判iPhone命名:不应加S</a></li> <li class="articleAbout"><a href=/ItNews/34274 title='Google要求硬件厂商捆绑预装应用的协议曝光' target="_blank"> Google要求硬件厂商捆绑预装应用的协议曝光</a></li> <li class="articleAbout"><a href=/ItNews/434 title='用友软件股价逆势下跌 再融资方案现曙光' target="_blank"> 用友软件股价逆势下跌 再融资方案现曙光</a></li> <li class="articleAbout"><a href=/ItNews/681 title='中方抗议美方限购IT设备 紧张关系加剧' target="_blank"> 中方抗议美方限购IT设备 紧张关系加剧</a></li> </ol> </div> </div> </div> </div> <div class="clearfix"></div> <footer class=" footer navbar-bottom"> <em>友情链接:</em> <a href="http://www.aiyiweb.com/" target="_blank">爱易网 </a> <a href="http://www.aiyiweb.com/" target="_blank">云虚拟主机技术 </a> <a href="http://www.aiyiweb.com/" target="_blank">云服务器技术 </a> <a href="http://www.aiyiweb.com/" target="_blank">程序设计技术 </a> <a href="http://www.aiyiweb.com/" target="_blank">开发网站 </a> <a href="http://www.aiyiweb.com/" target="_blank">APP开发教程 </a> <br /> <script type="text/javascript">(function(){document.write(unescape('%3Cdiv id="bdcs"%3E%3C/div%3E'));var bdcs = document.createElement('script');bdcs.type = 'text/javascript';bdcs.async = true;bdcs.src = 'http://znsv.baidu.com/customer_search/api/js?sid=15239353030108964139' + '&plate_url=' + encodeURIComponent(window.location.href) + '&t=' + Math.ceil(new Date()/3600000);var s = document.getElementsByTagName('script')[0];s.parentNode.insertBefore(bdcs, s);})();</script> Copyright © 2013-2025 爱易网页 当前在线:172人 网站在4时15分8秒内访问总人数:56838人 当前 9.16% <a href="https://beian.miit.gov.cn" target="_blank">粤ICP备18100884号-2 </a> <script charset="UTF-8" id="LA_COLLECT" src="//sdk.51.la/js-sdk-pro.min.js"></script> <script>LA.init({ id: "JszEmKrtpbU59dY5", ck: "JszEmKrtpbU59dY5" })</script> </footer> </div> </body> </html>