This section of the code mainly uses the OnMousedown event and the Event.button properties, the main features and usage are as follows.
The settimeout method executes an expression once, after the specified time, after loading, only once.
The Charat method returns a character value at the specified index position. The index of the first character in the string is 0, the second index is 1, and so on. An index value that is outside the valid range returns an empty string.
<ptml> <pead> <title> Typing effect of text effects </title> <meta http-equiv= "Content-type" content= "text/ html charset=gb2312 "/> <script language=" JavaScript "> var layers = document.layers; var style = document.all; var both = Layers | | Style var idme = 908601; if (layers)//if not ie browser {layerref = ' document.layers '; StyleRef = '; if (style)//if it is IE browser {layerref = ' document.all '; StyleRef = '. Style '; } function Writeontext (obj, str) {//function prints the string if (layers) {with (Document[obj]) {Document.open () on the page; document.write (str); The Write method prints the string document.close (); } if (style) eval (obj+ '. InnerHTML = Str '); Use the innerHTML property to display the string} var dispstr = new Array ("cloud-Habitat Community-www.jb51.net"); String array var overme = 0; function Txttyper (str, IDX, idobj, spobj, CLR1,CLR2, delay, plysnd)//functions: Achieve typing effect {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+" </font><font color= ' "+clr2+" ' > "+tmp1+" </font></span> "); Call the Writeontext function to display the characters on the Web page settimeout ("Txttyper", "+str+", "+idx+", "+idobj+", "" +spobj+ "," "+clr1+", "" +clr2+ "" " , "+delay+", "+plysnd+") ", delay); } function init () {txttyper (dispstr[0], 0, ' tt10 ', ' ttll ', ' #339933 ', ' #99FF33 ', 300, 0);//Invoke Txttyper function to start typing} &L T;/script> </pead> <body onload= "Init ();" > <center> <p> Typing effect </p> <pr/> <div class= "ttll" id= "tt10" ></div> ;/center> </body> </ptml>
[Ctrl + A All SELECT Note: If the need to introduce external JS need to refresh to perform]
After you run the program, the page appears with a message, and then the characters appear one at a time. After the characters appear, you can stop printing after you have finished printing.
Source program Interpretation
(1) The program first established a layer, its ID is ttl0, easy to call later. This layer is used to display printed text.
(2) The program adds the OnLoad event to the <body> element, and when the entire page is loaded, the event is triggered and the Init () event handler is invoked to process the event.
(3) in the function Txttyper (), use the CharAt method to get a character in the string. Use the IF condition statement to determine whether the character satisfies the end. Print on the page when the condition is met.
(4) In an If statement, you can also use any legitimate JavaScript statement to accomplish more complex operations.
