<!DOCTYPE HTML><HTMLLang= "en"><Head><MetaCharSet= "UTF-8"><title>JQ subtitle Typing effect</title><style>*{margin:0;padding:0;}Body{Background-color:#000;Color:#00FF00;padding:100px;font-size:30px;}. Hide{Display:None;}</style></Head><Body><!--div for output text -<DivID= "Showbox"></Div><!--text that you want to output -<Divclass= "Hide"ID= "Contowrite">Login:username<BR>Password: ******<BR>Access is granted<BR>What about Chinese? </Div><Scriptsrc= "Http://www.lamahui.com/static/1.0/js/base/v1.js"></Script><Script>$(function () { varShowbox= $('#showBox'), //Text OutputCon= $('#conToWrite'), //text that you want to outputtext= NULL, CharIndex= -1, Len= 0; functionwritecontent (init) {if(init) {text=con.html (); } if(CharIndex=== -1) {CharIndex= 0; Len=text.length; } varinitstring=showbox.html (); Initstring=Initstring.replace (/<span.*$/gi,"'); varTheChar=Text.charat (CharIndex); varNextfourchars=text.substr (CharIndex,4); if(Nextfourchars=== '<br>' ||Nextfourchars=== '<BR>') {TheChar= '<br>'; CharIndex+= 3; } initstring=initstring+TheChar+ "<span id= ' blink ' >_</span>"; Showbox.html (initstring); CharIndex=CharIndex/1 + 1; if(CharIndex% 2 === 1 ) { $('#blink'). Hide (); } Else { $('#blink'). Show (); } if(CharIndex<=Len) {SetTimeout (function() {writecontent (false); }, Max); } Else{Blinkspan (); } } varCurrentstyle= 'inline'; functionBlinkspan () {if(Currentstyle=='inline') {Currentstyle='None'; }Else{Currentstyle='inline'; } $('#blink'). CSS ('Display', Currentstyle); SetTimeout (function() {Blinkspan (); }, -); } writecontent (true);});</Script></Body></HTML>
Effects such as:
JQ Typing effect