JS实现以打字效果逐条显示的告示栏[网络技术]
本文“JS实现以打字效果逐条显示的告示栏[网络技术]”是由七道奇为您精心收集,来源于网络转载,文章版权归文章作者所有,本站不对其观点以及内容做任何评价,请读者自行判断,以下是其具体内容:
老早从前写的. 没什么用,写着玩的呵呵.只能在IE下用.没考虑兼容FIREFOX
作者:ninty
[code]<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<script type="text/javascript">
/**
author:joejoe1991
date:2009.5.20
*/
window.onerror = function(a,b,c) {//错误提醒
alert(a+b+c);
return true;
}
function TypeChar(obj) {
this.values = obj.values;
this.topContainer = document.getElementById(obj.topContainer);
this.speed = obj.speed;
this.voice = obj.voice;
this.currentCharIndex = 0; //当前字符的索引位置
this.currentValueIndex = 0; //当前字符串的索引位置
this.cursorChar = obj.cursorChar || "_"; //光标字符
this.lineHeight = obj.lineHeight || "normal"; //当有多行文字时,每行文字的行高.
}
TypeChar.prototype = {
start:function() {
if (this.voice) //假若有打字声音
{
this.player = document.createElement("embed"); //成立播放器
this.player.autostart = true; //自动播放
this.player.src = this.voice;
this.player.loop = true; //无限播放.
this.player.style.display = "none"; //躲藏播放器.
this.topContainer.appendChild(this.player);
}
var textContainer = document.createElement("div"); //文字容器
textContainer.style.lineHeight = this.lineHeight;
this.topContainer.appendChild(textContainer);
this.textContainer = textContainer; //设置文字容器.
this.type();
},
type:function() {
var type = this;
this.hideCursorChar();//去除光标字符.
this.textContainer.innerText += this.values[this.currentValueIndex].charAt(this.currentCharIndex);
this.showCursorChar(); //显示光标字符
this.currentCharIndex ++;
if (this.currentCharIndex < this.values[this.currentValueIndex].length) { //假如这一行还没有完毕
以上是“JS实现以打字效果逐条显示的告示栏[网络技术]”的内容,如果你对以上该文章内容感兴趣,你可以看看七道奇为您推荐以下文章:
本文地址: | 与您的QQ/BBS好友分享! |