JS实现打字机式字符输出效果
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=gb2312">
<title>JS打字机风格的字符输出特效</title>
<SCRIPT language="JavaScript">
<!--
var layers = document.layers, style = document.all, both = layers || style, idme=908601;
if (layers) { layerRef = 'document.layers'; styleRef = ''; } if (style) { layerRef = 'document.all'; styleRef = '.style'; }
function writeOnText(obj, str) {
if (layers) with (document[obj]) { document.open(); document.write(str); document.close(); }
if (style) eval(obj+'.innerHTML= str');
}
//以下是输出的内容,自己修改即可。
var dispStr = new Array(
"<font color=red size=3>欢迎来到源码爱好者...</font><br><font color=green size=3>她为我们提供各类编程源码、素材、书籍教程、设计模板、网页特效代码以及常用软件下载。</font><br><font color=blue size=3>是一个有质量的学习型源码下载站。</font>"
);
var overMe=0;
function txtTyper(str, idx, idObj, spObj, clr1, clr2, delay, plysnd) {
var tmp0 = tmp1 = '', skip = 0;
if (both && idx <= str.length) {
if (str.charAt(idx) == '<') { while (str.charAt(idx) != '>') idx++; idx++; }
if (str.charAt(idx) == '&' && str.charAt(idx+1) != ' ') { while (str.charAt(idx) != ';') idx++; idx++; }
tmp0 = str.slice(0,idx);
tmp1 = str.charAt(idx++);
if (overMe==0 && plysnd==1) {
if (navigator.plugins[0]) {
if (navigator.plugins["LiveAudio"][0].type=="audio/basic" && navigator.javaEnabled()) {
document.embeds[0].stop();
setTimeout("document.embeds[0].play(false)",100); }
} else if (document.all) {
ding.Stop();
setTimeout("ding.Run()",100);
}
overMe=1;
} else overMe=0; writeOnText(idObj, "<span class="+spObj+"><font color='"+clr1+"'>"+tmp0+"</font><font color='"+clr2+"'>"+tmp1+"</font></span>");
setTimeout("txtTyper('"+str+"', "+idx+", '"+idObj+"', '"+spObj+"', '"+clr1+"', '"+clr2+"', "+delay+" ,"+plysnd+")",delay);
}
} function init() {
txtTyper(dispStr[0], 0, 'ttl0', 'ttl1', '#339933', '#99FF33', 50, 0);
}
// -->
</SCRIPT>
</head>
<body bgcolor="#fef4d9" onload="init()">
<DIV class=ttl1 id=ttl0><SPAN class=ttl1></SPAN></DIV>
</body>
</html>
JS实现打字机式字符输出效果的更多相关文章
- Strip JS – 低侵入,响应式的 Lightbox 效果
Strip 是一个灯箱效果插件,显示的时候只会覆盖部分的页面,这使得侵扰程度较低,并留出了空间与页面上的大屏幕,同时给予小型移动设备上的经典灯箱体验.Strp JS 基于 jQuery 库实现,支持 ...
- 【Windows编程】系列第三篇:文本字符输出
上一篇我们展示了如何使用Windows SDK创建基本控件,本篇来讨论如何输出文本字符. 在使用Win32编程时,我们常常要输出文本到窗口上,Windows所有的文本字符或者图形输出都是通过图形设备接 ...
- Glide.js:响应式 & 触摸友好的 jQuery 滑块插件
Glide.js 是一款响应式和对触摸友好的 jQuery 滑块.基于 CSS3 转换实现,并在低版本浏览器降级处理.Glide.js 简单,重量轻,快速,适用于智能手机,平板电脑和台式机.它支持 s ...
- js实现中文简繁切换效果
html代码: <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www ...
- api (三)文本字符输出 (转)
在使用Win32编程时,我们常常要输出文本到窗口上,Windows所有的文本字符或者图形输出都是通过图形设备接口(GDI)进行的,Windows的三大核心组件之一的GDI32.dll封装了所有的文本和 ...
- Js实现京东无延迟菜单效果(demo)
一个端午节,外面人山人海,又那么热,我认为宅在家里看看慕课网,充实自己来的实际... 这是一个js实现京东无延迟菜单效果,感觉很好,分享给大家... 1.开发基本的菜单结构 2.开发普通的二级菜单效果 ...
- js数据类型隐式转换问题
js数据类型隐式转换 ![] == false //true 空数组和基本类型转换,会先[].toString() 再继续比较 ![] == [] //true ![] //false [] == [ ...
- Android UI体验之全屏沉浸式透明状态栏效果
前言: Android 4.4之后谷歌提供了沉浸式全屏体验, 在沉浸式全屏模式下, 状态栏. 虚拟按键动态隐藏, 应用可以使用完整的屏幕空间, 按照 Google 的说法, 给用户一种 身临其境 的体 ...
- js鼠标滚轮滚动图片切换效果
效果体验网址:http://keleyi.com/keleyi/phtml/image/12.htm HTML文件代码: <!DOCTYPE html PUBLIC "-//W3C// ...
随机推荐
- SQL SERVER提供了大量的WINDOWS和SQLSERVER专用的排序规则
初始选择结果 select * from WordDictionary 下面是按照汉字拼音排序 select * from WordDictionary order by word collate C ...
- Asp.net通过Jquery操作WebService进行Ajax读写
一说到开始,我们当然需要项目. 首先,创建一个Asp.net Web 应用,然后新增一个名称为“Web 服务”的文件,也就是后缀名为".asmx"的文件,然后需要进行配置一下,在W ...
- Java系列:Add Microsoft SQL JDBC driver to Maven
Maven does not directly support some libraries, like Microsoft's SQL Server JDBC. This tutorial will ...
- xcode 出现the file couldn't be opened 怎么解决
右键——show In finder——显示xcode包内容——将有数字的删除——把有用的xcode双击
- 《Java程序设计》第五次实验实验报告
实验封面 一.实验内容 1.阅读理解源码进入07_httpd所在的目录,使用vi编辑器理解源代码. 2.编译应用程序使用gcc编译器,分别对文件夹下的copy.c和httpd.c进行编译,出现copy ...
- 我的权限系统设计实现MVC4 + WebAPI + EasyUI + Knockout(三)图形化机构树
一.前言 组织机构是国内管理系统中很重要的一个概念,以前我们基本都是采用数据列表的形式展现,最多只是采用树形列表展现.虽然够用,但是如果能做成图形化当然是最好不过了.这里我不用任何图形控件,就用最原始 ...
- 结合php ob函数理解缓冲机制
对于一个刚刚入门的php程序员来说,php缓冲区是几乎透明的.在他们心目中,一个echo print_r 函数,数据便会‘嗖’的一声飞到浏览器上,显示出来.我也一直如此单纯地认为. 其实,在技术的世界 ...
- mysql使用基础 sql语句(一)
csdn博文地址:mysql使用基础 sql语句(一) 点击进入 命令行输入mysql -u root -p,回车再输入密码,进入mysql. 终端命令以分号作为一条语句的结束,可分为多行输入,只需 ...
- Linq 中查询一个表中指定的字段
//Linq中查询一个表中指定的几个字段: ); // FindAllItems()为查询对应表的所有数据的方法: // Where 里面为查询条件 // Select 为查询的筛选条件 new{} ...
- 年前辞职-WCF入门(6)
前言 昨天早上去医院做入职体检,被告知要预约,本以为是要排队,我连视频都准备好了...结果就回来了.下午去了新公司那边找房子,2了,因为公司提供了班车列表,我既然就只在班车所经过的几个地方找,却遗漏了 ...