DHTML tutorial for Absolute Beginner * What is DHTML * DHTML Basics * DHTML Fundamentals * Lamens DHTML * Layman's DHTML

WARNING !!!! if (you read this article) { at the end of reading(you should answer the questions given below); } else { quit && go search for some masala videos; }

The Questions that are waiting for you are : 1. What is DHTML. 2. If I want to create DHTML web site, then I should know something about html,css and javascript. Is this statement is true or false? 3. Why the word "DYNAMIC" is used in "DHTML"? 4. What do you understand by 'Coronary Artery disease'?

DHTML stands for?

Dynamic HyperText Markup Language.

In what way it is different from Normal HTML?

If you are able to bring some kind of DYNAMIC EFFECT (animated effect) in your html page, by using CSS AND JAVASCRIPT, then your page can be called as DHTML page.

Hmmm! Not able to grasp the meaning of DYNAMIC EFFECT? Don't worry. Letus try with some example. Move your mouse over Preity or Rani.

Move your Mouse over me Move Your mouse over me. Yes, now you agree that this page has some kind of dynamic or animatic or interactive behavior.Is that right? If the web developer has used CSS and JAVASCRIPT to bring this dynamic property to his page, then that page is a DHTML page <!--The DHTML code for the above example is given here.copy this code in a notepad and save it as test.htm and run it--> <script type="text/javascript"> function showInfo(infoText){ document.getElementById('info').innerHTML=infoText; } function reset(){ document.getElementById('info').innerHTML=""; } </script> <span onmouseover="showInfo('Preity! Yes!! Ofcourse !!!')" onmouseout="reset()">Do you like Preity Zinta?</span> <br/> <span onmouseover="showInfo('Rani? Why Not?')" onmouseout="reset()">Do you like Rani Mukharji?</span> <br/> <span style="background-color:yellow;border:2px dotted #ff0000;height:20px;width:80px" id="info"> </span>

Example 2 : Move your mouse over the three color boxes.

<script type="text/javascript"> function showColor(myColor) { document.getElementById('colorBox').style.background=myColor; } </script> <table width="150" align="center" cellpadding="10"> <tr> <td width="20" bgcolor="yellow" onmouseover="showColor('yellow')"> </td> <td width="20" bgcolor="red" onmouseover="showColor('red')"> </td> <td width="20" bgcolor="orange" onmouseover="showColor('orange')"> </td> </tr> </table>

Example 3.When you click the button, there will be an earth quake. (Anyway, there is no need of holding your chair while clicking)

I can hear your shouting "Aiyaiyo ! It is really Dynamic paa.." <!--COPY AND PASTE THIS CODE IN NOTEPAD AND SAVE AS TEST.HTM AND RUN--> <script> function startShake(){ movesize=5; parent.moveBy(0,movesize); parent.moveBy(0,-movesize); parent.moveBy(movesize,0); parent.moveBy(-movesize,0); timer=setTimeout("startShake()",10); } function stopShake(){ clearTimeout(timer); } </script> <button onclick="startShake();">Start Shaking</button>    <button onClick="stopShake()">Stop Shaking</button>

Is that all I should know about DHTML?

If you want to act before your fig... as if you know DHTML, then this is more than enough. But if you are a web designer and if you want to implement DHTML, then you have to read more. The best web site I recommend is W3schools. Don't miss this site. It is really really really really really a SUPER SCHOOL for any web developer.

Ooooops ! DHTML is enough for today. Let us take a diversion and learn what is CORONARY ARTERY DiSEASE.

1. It is commonly known as Heart Disease. 2. It is the leading cause of death in USA and other countries. 3. Cholesterol is deposited in the artery walls as plaque and block the flowing of blood. 4. So, for the sake of you and your family Browse more about cholesterol than DHTML. Better visithealth central.com