javascript - display array words with different pauses -
i have javascript array:
["joe", "james", "jane", "jim", "jack", "adam", "jill", "jake", "john", "joel", "jeff", "charles"]
the idea display lowercase names 500ms second replace next lowercase name (also 500ms). when capitalized names, want stay on 5000ms. ideally there pattern of 5 lowercase , 1 capitalized.
if must:
//<![cdata[ var pre = onload, doc, bod, e, weirdwait; // use on other loads onload = function(){ if(pre)pre(); // use different var name hold more loads on other pages doc = document; bod = doc.body; e = function(id){ return doc.getelementbyid(id); // hope learned here } weirdwait = function(displaydiv, yourarray, timerdiv){ var = 0; displaydiv.innerhtml = yourarray[i]; if(timerdiv)timerdiv.innerhtml = new date().tostring(); function recurse(){ var si = setinterval(function(){ i++; if(!yourarray.hasownproperty(i))i = 0; var val = yourarray[i]; displaydiv.innerhtml = val; if(timerdiv)timerdiv.innerhtml = new date().tostring(); if(val.match(/^[a-z]/)){ clearinterval(si); settimeout(recurse, 4500); } }, 500); } recurse(); } var yourarray = ['joe', 'james', 'jane', 'jim', 'jack', 'adam', 'jill', 'jake', 'john', 'joel', 'jeff', 'charles']; weirdwait(e('output'), yourarray, e('timer')); } //]]>
html,body{ padding:0; margin:0; } .main{ width:940px; background:#000; color:#fff; padding:20px; margin:0 auto; } #output{ font:bold 64px arial, helvetica, sans-serif; }
<!doctype html> <html xmlns='http://www.w3.org/1999/xhtml' xml:lang='en' lang='en'> <head> <meta http-equiv='content-type' content='text/html;charset=utf-8' /> <meta name='viewport' content='width=device-width' /> <title>weird wait</title> <link type='text/css' rel='stylesheet' href='external.css' /> <script type='text/javascript' src='external.js'></script> </head> <body> <div class='main'> <div id='output'></div> <div id='timer'></div> </div> </body> </html>
Comments
Post a Comment