Tag Archives: dhtml example

Dhtml Blink Text

DHTML Blink Text <html> <head> <script type=”text/javascript”> function blinking_header() { if (!document.getElementById(‘blink’).style.color) { document.getElementById(‘blink’).style.color=”red”; } if (document.getElementById(‘blink’).style.color==”red”) { document.getElementById(‘blink’).style.color=”black”; } else { document.getElementById(‘blink’).style.color=”red”; } timer=setTimeout(“blinking_header()”,100); } function stoptimer() { clearTimeout(timer); } </script> </head> <body onload=”blinking_header()” onunload=”stoptimer()”> <h1 id=”blink”>Blinking header</h1> </body> </html> View Output

Dhtml Example Tooltip

Dhtml Example Tooltip <html><head> <script> function gettip(txt) { document.getElementById(‘tip’).innerHTML=txt; } function reset() { document.getElementById(‘tip’).innerHTML=””; } </script> </head> <body> <p>Mouse over these drinks:</p> <span onmouseout=”reset()”>Coffee</span> <br /><br /> <span onmouseout=”reset()”>Milk</span> <p id=”tip”></p> </body> </html> OUTPUT: Mouse over these drinks: Coffee Milk

Text Change Position

Text Change Position <html> <head> <script> function moveleft() { document.getElementById(‘header’).style.position=”absolute”; document.getElementById(‘header’).style.left=”0″; } function moveback() { document.getElementById(‘header’).style.position=”relative”; } </script> </head> <body> <h1 id=”header” onmouseover=”moveleft()” onmouseout=”moveback()”> Mouse over this text</h1> </body> </html> OUTPUT: Mouse over this text

Change Text On Mouse Over

Change Text On Mouse Over <html> <head> <script> function nameon() { document.getElementById(‘h2text’).innerHTML=”WELCOME!”; } function nameout() { document.getElementById(‘h2text’).innerHTML=”How are you today?”; } </script> </head> <body> <h2 onmouseout=”nameout()” onmouseover=”nameon()” ┬áid=”h2text”> Mouse over this text!</h2> </body> </html> Mouse over this text!

Event onkeyup

Event onkeyup <html> <head> <script> function writeMessage() { document.forms[0].mySecondInput.value=document.forms[0].myInput.value; } </script> </head> <body> <p>The onkeyup event occurs when the a keyboard key is on it’s way UP.</p> <form> Write a message:<br /> <input onkeyup=”writeMessage()” size=”20″> <input name=”mySecondInput” size=”20″> </form> </body> </html> OUTPUT: The onkeyup event occurs when the a keyboard key is on it’s way […]