Cross browser/ version DHTML content

Creating dynamic content that functions in all modern DHTML browsers is now just a matter of picking your poison for changing content on the fly, along with some simple logic. Remember the example we saw on the very first page of this tutorial?


Here is complete source code to it:

<div id="dcontent" style="width:100%; background-color: #E2E2FC; padding-left: 5px"></div>

<script type="text/javascript">

var mycontent=new Array()
mycontent[0]=' <img src=""> Learn about JavaScript and get free scripts at <a href="">JavaScript Kit!</a>'
mycontent[1]=' <img src=""> Visit <a href="">Dynamic Drive</a> for the best DHTML scripts and components on the web!'
mycontent[2]=' <img src=""> The <a href="">CSS Drive</a> CSS gallery and examples.'
mycontent[3]=' <img src=""> Web coding and development forums'

var i=0

function altercontent(){
if (document.all)
else if (document.getElementById){
rng = document.createRange();
el = document.getElementById("dcontent");
htmlFrag = rng.createContextualFragment(mycontent[i]);
while (el.hasChildNodes()) el.removeChild(el.lastChild);

i=(i==mycontent.length-1)? 0 : i+1
setTimeout("altercontent()", 3000)



And with that we conclude this tutorial. But wait, maybe, just maybe, you are interested in learning how dynamic content is realized in a historic browser called Netscape 4. "Yes" you say? Ok then, lets kill some time and see how.