打字特效代码js（html打字机特效）

本篇文章给大家谈谈打字特效代码js，以及html打字机特效对应的知识点，希望对各位有所帮助，不要忘了收藏本站喔。

本文目录一览：

• 1、JS打字特效带光标闪烁。
• 2、有没有js代码让文字有发光效果
• 3、使用JS实现一个打字机字符输出效果
• 4、关于Javascript 特效代码
• 5、求网页特效代码

JS打字特效带光标闪烁。

htmlheadtitleType Write/titlestyle type="text/css"a{text-decoration:none}/style/headbody  

div id="newsticker"span id="tickertitle"/spana id="typewriter" href="#"/a/div  

/body  

/html  

script type="text/javascript"  

// please keep these lines on when you copy the source  

// made by: Nicolas -   

var current = 0  

var x = 0  

var speed = 70  

var speed2 = 2000  

function initArray(n) {  

  this.length = n;  

  for (var i =1; i = n; i++) {  

    this[i] = ' '  

  }  

}  

typ = new initArray(16);  

typ[0]="406:red:Texas last in US Gov State Governors Websites (June 2008)";  

typ[1]="409:red:The Insolvency Service last in UK Central Government (June 2008)";  

typ[2]="384:green:Federated States of Micronesia 1st in US Gov State and Territorial Government Websites (April 2008)";  

typ[3]="413:green:U.S. Immigration and Customs Enforcement highest climber in US Gov Federal Agencies  (up 188) - June 2008";  

typ[4]="371:green:Iowa 1st in US Gov State Governors Websites (April 2008)";  

typ[5]="373:green:Directgov Jobs and Skills 1st in UK Central Government (April 2008)";  

typ[6]="379:red:Birmingham last in UK Local Government (April 2008)";  

typ[7]="406:green:Utah highest climber in US Gov State Governors Websites (up 16) - June 2008";  

typ[8]="380:red:Kent Police greatest faller in Police Forces (down 31) - April 2008";  

function typewrite() {  

  var m = typ[current];  

  document.getElementById("typewriter").href = '/survey/report.html?rt=' + m.substring(0,m.indexOf(':'));  

  m = m.substring(m.indexOf(':') + 1);  

  document.getElementById("typewriter").style.color = m.substring(0,m.indexOf(':'));  

  m = m.substring(m.indexOf(':') + 1);  

  m = m.replace("","and");  

  document.getElementById("typewriter").innerHTML = m.substring(0, x++) + "_";  

  if (x == m.length + 1) {  

    x = 0  

    current++  

    if (current  typ.length - 1) {  

      current = 0  

    }  

    setTimeout("typewrite()", speed2)  

    }  

  else {  

    setTimeout("typewrite()", speed)  

  }  

}  

//document.getElementById("tickertitle").innerHTML = "Latest: ";  

/*document.getElementById("smHeadlines").style.padding = "10px";*/  

typewrite()  

/script

有没有js代码让文字有发光效果

!DOCTYPE HTML    

html    

head    

title/title

style type="text/css"    

html { overflow: hidden; }    

body { position: absolute; margin: 0px; padding: 0px; background: #000; width: 100%; height: 100%; }    

#bump { position: absolute; border: #222 solid 1px; width: 530px; height: 100px; margin-left: -265px; margin-top: -50px; left: 50%; top: 50%; }    

#bump span { position: absolute; font-size: 1px; cursor: pointer; }    

#ch { position: absolute; border-top: #222 solid 1px; left: 0; width: 100%; }    

#cv { position: absolute; border-left: #222 solid 1px; top: 0; height: 100%; }    

/style    

script type="text/javascript" 

var bmp = function () {    

// private vars    

var object  = [],    

ZOOMx,    

ZOOMy,    

xm,    

ym,    

nx,    

ny,    

cx,    

cy,    

Nx,    

Ny,    

L,    

T,    

W,    

H,    

SP,    

cH,    

cV,    

N  = 1,    

iL = 1,    

iP = 2,    

M  = 200,    

kA = 0,    

S  = 100;    

var resize = function () {    

nx = document.body.offsetWidth / 2;    

ny = document.body.offsetHeight / 2;    

W = SP.offsetWidth;    

H = SP.offsetHeight;    

L = SP.offsetLeft;    

T = SP.offsetTop;    

};    

var init = function (bump) {    

document.onselectstart = new Function("return false");    

document.onmousedown = function(){ iL = 2; iP = 4; };    

document.onmouseup = function(){ iL = 1; iP = 2;};    

document.onmousemove = function(e){    

if (!e) e = window.event;    

xm = (e.x || e.clientX);    

ym = (e.y || e.clientY);    

S = 10;    

M = 200;    

return false;    

};    

onresize = resize;    

var sb = function(c ,x ,y) {    

bump[y] = bump[y].substring(0,x) + c+bump[y].substring(x+1,999);    

};    

var b = function(x, y) {    

return bump[y].charAt(x);    

};    

SP = document.getElementById("bump");    

cH = document.getElementById("ch");    

cV = document.getElementById("cv");    

Ny = bump.length;    

Nx = bump[0].length;    

resize();    

ZOOMx = Math.floor(W / Nx);    

ZOOMy = Math.floor(H / Ny);    

ym = T + ZOOMx * Ny / 2;    

cx = xm = L + ZOOMy * Nx / 2;    

cy = -200;    

// set shadows    

for(var i = 1; i  Ny-1; i++) {    

for(var j = 1; j  Nx-1; j++) {    

if (b(j,i) === "O") {    

if (b(j,i+1)   === " ") sb("-",j,i+1);    

if (b(j+1,i+1) === " ") sb("-",j+1,i+1);    

if (b(j+1,i)   === " " || b(j+1,i)    === "-") sb("!",j+1,i);    

if (b(j+1,i)   === "!"  (b(j+1,i-1) === " " || b(j+1,i-1) === "-")) sb("!",j+1,i-1);    

if (b(j,i-1)   === " " || b(j,i-1)    === "I") sb("=",j,i-1);    

if (b(j,i-1)   === "="  (b(j-1,i-1) === " " || b(j-1,i-1) === "I")) sb("=",j-1,i-1);    

if (b(j-1,i)   === " " || b(j-1,i)    === "-") sb("I",j-1,i);    

if (b(j-1,i)   === "I"  (b(j-1,i+1) === " " || b(j-1,i+1) === "-")) sb("I",j-1,i+1);    

}    

}    

}    

// compression spans    

for(var i=0; i  Ny; i++) {    

var w = 0;    

for(var j = 0; j  Nx; j++) {    

var c = bump[i].charAt(j);    

if (c != " "){    

var x = j,    

y = i,    

k = j,    

w = 0,    

h = 1,    

m = i,    

cs = "",    

cr = c;    

do {    

k++;    

w++;    

cs += cr;    

cr = bump[i].charAt(k);    

} while (cr == c  k  Nx);    

if (i  Ny-1){    

do {    

m++;    

if (bump[m].substring(j,j+w) == cs) {    

h++;    

bump[m] = bump[m].substring(0,j) +    

cs.replace(RegExp(c,"gi")," ") +    

bump[m].substring(j+w,999);    

} else cs = "";    

} while (cs!=""  m  Ny-1);    

}    

object.push(    

new CObj(c, x, y, w, h)    

);    

j += w-1;    

}    

}    

}    

mainloop();    

};    

var CObj = function(c, x, y, w ,h) {    

var M1 = {    

"O": 0,    

"I": 1,    

"!": -1,    

"=": 0,    

"-": 0    

},    

M2 = {    

"O": 0,    

"I": 0,    

"!": 0,    

"=": 1,    

"-": -1    

},    

M3 = {    

"O": 180,    

"I": 115,    

"!": 115,    

"=": 115,    

"-": 115    

};    

this.c  = c;    

this.x  = ZOOMx * x;    

this.y  = ZOOMy * y;    

this.m1 = M1[c];    

this.m2 = M2[c];    

this.m3 = M3[c];    

this.O  = document.createElement("span");    

this.O.style.left   = Math.round(this.x) + "px";    

this.O.style.top    = Math.round(this.y) + "px";    

this.O.style.width  = Math.round(ZOOMx * w) + "px";    

this.O.style.height = Math.round(ZOOMy * h) + "px";    

SP.appendChild(this.O);    

};    

CObj.prototype.bumpmapping = function() {    

var dx = (cx - this.x - L) / (5 * H) * iP;    

var dy = (cy - this.y - T) / (5 * H) * iP;    

var col = Math.round(    

iL * (255 - Math.floor(    

this.m3 * Math.sqrt(    

(dx + this.m1) * (dx + this.m1) + (dy + this.m2) * (dy + this.m2)    

)    

))    

);    

this.O.style.backgroundColor = "RGB(" +    

Math.round(col * 2)   + "," +    

Math.round(col * 1.5) + "," +    

Math.round(col)       + ")";    

}    

var mainloop = function () {    

if(M--  0){    

S = 100;    

kA -= .01;    

xm = nx + Math.cos(kA) * W * 1;    

ym = ny + Math.sin(kA * 1.1) * H * 2;    

}    

cx += (xm - cx) / S;    

cy += (ym - cy) / S;    

cH.style.top  = Math.round(cy) + "px";    

cV.style.left = Math.round(cx) + "px";    

var i = 0, o;    

while ( o = object[i++] ) o.bumpmapping();    

setTimeout(mainloop,16);    

};    

return {    

// public functions    

init: init    

}    

}();    

/script    

/head    

body    

div id="ch"/div    

div id="cv"/div    

div id="bump"/div    

script type="text/javascript"

bmp.init(    

[    

"                                                                  ",    

" OOOOOOO      OO    OO     OOOOOOOO      OOO    OOO      OO       ",    

" OOOOOOOO     OO    OO     OOOOOOOO     OOOOOOOOOOOO     OO       ",    

" OO    OO     OO    OO        OO        OO   OO   OO     OO       ",    

" OO    OO     OOOOOOOO        OO        OO   OO   OO     OO       ",    

" OO    OO     OOOOOOOO        OO        OO   OO   OO     OO       ",    

" OO    OO     OO    OO        OO        OO        OO     OO       ",    

" OO    OO     OO    OO        OO        OO        OO     OO       ",    

" OOOOOOOO     OO    OO        OO        OO        OO     OOOOOOOO ",    

" OOOOOOO      OO    OO        OO        OO        OO     OOOOOOOO ",    

"                                                                  "    

]    

);    

/script    

/body    

/html

使用JS实现一个打字机字符输出效果

!DOCTYPE html

head

meta http-equiv="Content-Type" content="text/html; charset=utf-8" /

title打字机效果/title

script

window.onload = function (){

var text = document.getElementById('text');

var str = '使用JS实现一个打字机字符输出效果使用JS实现一个打字机字符输出效果使用JS实现一个打字机字符输出效果使用JS实现一个打字机字符输出效果';

var arr = [];

for(var i=0;istr.length;i++){

arr.push(str[i])

}

var text1 = '';

var num = 0;

var timer = setInterval(function (){

if(num  arr.length){

text1 += arr[num];

text.innerHTML = text1

num++;

} else {

clearInterval(timer)

}

},200)

}

/script

/head

body

div id='text'/div

/body

/html

关于Javascript 特效代码

script language="JavaScript"

!-- Hide the script from old browsers --

function compute(obj) //定义一个函数 名字叫compute 他接收了一个参数 obj

{obj.expr.value = eval(obj.expr.value)} //当前的参数的值和下文参数值所用的方法相同

var one = '1' //定义一个字符型的1

var two = '2' //定义一个字符型的2

var three = '3' //定义一个字符型的3

var four = '4' //定义一个字符型的4

var five = '5' //定义一个字符型的5

var six = '6' //定义一个字符型的6

var seven = '7' //定义一个字符型的7

var eight = '8' //定义一个字符型的8

var nine = '9' //定义一个字符型的9

var zero = '0' //定义一个字符型的0

var plus = '+' //定义一个字符型的+

var minus = '-' //定义一个字符型的*

var multiply = '*' //定义一个字符型的*

var divide = '/' //定义一个字符型的/

var decimal = '.' //定义一个字符型的.

function enter(obj, string) //定义一个函数 名字叫enter 他接收了一个参数 obj

{obj.expr.value += string} //让 obj的值加上 '+'后面的值

function clear(obj) //定义一个函数 名字叫clear 他接收了一个参数 obj

{obj.expr.value = ''} //让obj的值等于空

// --End Hiding Here --

/script

form name="calc"

table border=1

td colspan=4input type="text" name="expr" size=30 action="compute(this.form)" tr

!--提交表单--

tdinput type="button" value=" 7 " onClick="enter(this.form, seven)"!--当鼠标点击

按钮的时候提交给函数按钮中的值--

tdinput type="button" value=" 8 " onClick="enter(this.form, eight)"!--当鼠标点击

按钮的时候提交给函数按钮中的值--

tdinput type="button" value=" 9 " onClick="enter(this.form, nine)"!--当鼠标点击

按钮的时候提交给函数按钮中的值--

tdinput type="button" value=" / " onClick="enter(this.form, divide)"!--当鼠标点

击按钮的时候提交给函数按钮中的值--

trtdinput type="button" value=" 4 " onClick="enter(this.form, four)"!--当鼠标

点击按钮的时候提交给函数按钮中的值--

tdinput type="button" value=" 5 " onClick="enter(this.form, five)"!--当鼠标点击

按钮的时候提交给函数按钮中的值--

tdinput type="button" value=" 6 " onClick="enter(this.form, six)"!--当鼠标点击按

钮的时候提交给函数按钮中的值--

tdinput type="button" value=" * " onClick="enter(this.form, multiply)"!--当鼠标

点击按钮的时候提交给函数按钮中的值--

trtdinput type="button" value=" 1 " onClick="enter(this.form, one)"!--当鼠标点

击按钮的时候提交给函数按钮中的值--

tdinput type="button" value=" 2 " onClick="enter(this.form, two)"!--当鼠标点击按

钮的时候提交给函数按钮中的值--

tdinput type="button" value=" 3 " onClick="enter(this.form, three)"!--当鼠标点击

按钮的时候提交给函数按钮中的值--

tdinput type="button" value=" - " onClick="enter(this.form, minus)"!--当鼠标点

击按钮的时候提交给函数按钮中的值--

trtd colspan=2input type="button" value=" 0 " onClick="enter

(this.form, zero)"!--当鼠标点击按钮的时候提交给函数按钮中的值--

tdinput type="button" value=" . " onClick="enter(this.form, decimal)"!--当鼠标

点击按钮的时候提交给函数按钮中的值--

tdinput type="button" value=" + " onClick="enter(this.form, plus)"!--当鼠标点击

按钮的时候提交给函数按钮中的值--

trtd colspan=2input type="button" value=" = " onClick="compute(this.form)"!

--提交表单在javascript中进行运算--

td colspan=2input type="button" value="AC" size= 3 onClick="clear(this.form)" !--

点击此按钮调用此函数--

/table

/form

求网页特效代码

打字效果的文字特效[修改显示的文字即可]

[根据下面的说明进行共1步]

====2、以下代码放在HTML的body/body之间[适当的位置]：

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("javascript源码大全");

var overMe=0;

function txtTyper(str,idx,idObj,spObj,clr1,clr2,delay,plysnd){

var tmp0=tmp1= '',skip=100;

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+"/fontfont 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', 300, 0);}

/script

BODY onload=init()

DIV class=ttl1 id=ttl0/DIV

/BODY

关于打字特效代码js和html打字机特效的介绍到此就结束了，不知道你从中找到你需要的信息了吗 ？如果你还想了解更多这方面的信息，记得收藏关注本站。