javascript实现的动态文字变换

2016-02-19 09:16 13 1 收藏

给自己一点时间接受自己,爱自己,趁着下午茶的时间来学习图老师推荐的javascript实现的动态文字变换,过去的都会过去,迎接崭新的开始,释放更美好的自己。

【 tulaoshi.com - Web开发 】

实现文字渐淡显示的效果代码如下:

  html 
  head
  script 
  !-- 
  function HelpArray(len){this.length=len } 
  HelpText= new HelpArray(5) 
  HelpText[0]="视点闪客" 
  HelpText[1]="智慧无边" 
  HelpText[2]="魅力无限" 
  HelpText[3]="十二亿中国人的最爱"
  HelpText[4]="http://visionflash.blog.sohu.com" 
  ScriptText=new HelpArray(5)
  //*定义文本数组,一共是五段文本*// 
  var i = -1 
  function playHelp() { 
  if (i==4) { i=0 } 
  else { i++ } 
  div1.filters[0].apply() 
  div1.innerText=HelpText[i] 
  div1.filters[0].play() 
  mytimeout=setTimeout("playHelp()",2500)} 
  //*定义play函数,并且设置了时间间隔*//
  -- 
  /script 
  style !-- 
  #div1{position:absolute;top:20;left:20;width:480;height:200; 
     font-family:行书体; color:red;font-size:40;
     font-weight:bold;text-align:center; 
     filter:revealtrans(transition=12,duration=2) } 
  //*设置显示转换滤镜*//
       -- 
  /style /head 
  body onload="playHelp()" 
  div id="div1" onload="playHelp()" /div 
  /body 
  /html

来源:http://www.tulaoshi.com/n/20160219/1590175.html

延伸阅读
标签: word
如何变换Word中文字方向   在Word中编辑时,为了能够使文档更具特色,很多时候我们都会采取改变文字方向的方式。今天,图老师小编就要来教一下大家,变换文字方向的技巧,让你编辑的文档也更具魅力。 Word 操作步骤 1、选中一段内容,按鼠标右键选择文字方向。 2、弹出文字方向-主文档按用户需求设置,然后将...
标签: Web开发
有很多提供动态创建 style 节点的方法,但是大多数都仅限于外部的 css 文件。如何能使用程序生成的字符串动态创建 style 节点,我搞了2个小时。 静态外部 css 文件语法: @import url(style.css); 动态外部 css 文件加载的方法有如下: 第一种: var style = document.createElement(’link’); style.href = ’style.c...
标签: Web开发
style type="text/css"    #oContainer {          width: 600px;          height: 500px;          border: 1px solid menu;   ...
  FrontPage通过“格式”菜单中的“网页过渡”选项,可以为网页的进入或退出设置不同的动态效果。但Dreamweaver中并没有这个特效选项,需另外安装插件。其实,要实现这一效果,用如下方法便可轻松获得: 打开网页源代码,若你想实现网页以垂直百叶窗的方式打开,可以在源代码的〈head〉与〈/head〉之间加入如下语句〈meta http-equiv="Pa...
标签: Web开发
在网上看到有不少JS设计模式的示例。 今天参照: http://www.cnblogs.com/iloveu/archive/2009/03/31/1426234.html 写了一下,记录在此,仅作备忘: !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...

经验教程

897

收藏

7
微博分享 QQ分享 QQ空间 手机页面 收藏网站 回到头部