getElementById function Probelm

I have code problem

when you click any topic from this code it show all the topic

It should show
Topic 1 for Topic 1
Topic 2 for topic 2
and so on

so if user click twice on Topic 1 is should popup only Topic 1
NOT 2,3,4,5

Here is the code

Do not give me new code because this works on NE 4 and NE 6 and IE so i don't want new code
Thanks

<html>
<head>
<title>Untitled Document</title>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
</head>

<body bgcolor="#CCCCCC" text="#000000">
<td bgcolor=#003366 valign=bottom width=589>
<table border=1 cellspacing=1 cellpadding=5 width="497">
<tr> <td><a style="cursor:hand" onClick="altercontent(1)" href="#no"> Topic 1</a> &nbsp;&nbsp;&nbsp;&nbsp;<a style="cursor:hand" onClick="altercontent(2)" href="#no">Topic 2</a> &nbsp;&nbsp;&nbsp;&nbsp;<a style="cursor:hand" onClick="altercontent(3)" href="#no">Topic 3</a> &nbsp;&nbsp;&nbsp;&nbsp;<a style="cursor:hand" onClick="altercontent(4)" href="#no">Topic 4</a> &nbsp;&nbsp;&nbsp;&nbsp;<a style="cursor:hand" onClick="altercontent(5)" href="#no">Topic 5</a></td></tr>
</table>
<div id="dcontent" style="width:589px;height:28px"></div>
<ilayer id="ns4dcontent" width=589px height=28px left="-1">
<layer id="ns4dcontent2" width=589px height=28px></layer></ilayer>
<script>
//the html contents to display
var mycontent=new Array()
mycontent[0]='Topic 1<br>Topic 1<br>Topic 1<br>Topic 1<br>Topic 1<br>Topic 1<br>Topic 1<br>Topic 1<br>'
mycontent[1]='Topic 2<br>Topic 2<br>Topic 2<br>Topic 2<br>Topic 2<br>Topic 2<br>Topic 2<br>Topic 2<br>'
mycontent[2]='Topic 3<br>Topic 3<br>Topic 3<br>Topic 3<br>Topic 3<br>Topic 3<br>Topic 3<br>Topic 3<br>'
mycontent[3]='Topic 4<br>Topic 4<br>Topic 4<br>Topic 4<br>Topic 4<br>Topic 4<br>Topic 4<br>Topic 4<br>'
mycontent[4]='Topic 5<br>Topic 5<br>Topic 5<br>Topic 5<br>Topic 5<br>Topic 5<br>Topic 5<br>Topic 5<br>'
var i=0

function altercontent(){
//if IE 4+
if (document.all)
dcontent.innerHTML=mycontent[i];
//else if NS 4
else if (document.layers){
document.ns4dcontent.document.ns4dcontent2.
document.write(mycontent[i]);
document.ns4dcontent.document.ns4dcontent2.
document.close();
}
//else if NS 6 (supports new DOM)
else if (document.getElementById){
rng = document.createRange();
el = document.getElementById("dcontent");
rng.setStartBefore(el);
htmlFrag = rng.createContextualFragment(mycontent[i]);
while (el.hasChildNodes())
el.removeChild(el.lastChild);
el.appendChild(htmlFrag);
}

if (i==mycontent.length-1)
i=0
else
i++
}

function beginrotation(){
if (document.all||document.layers||document.getElementById)
setInterval("altercontent()")
}
window.onload=beginrotation


</script>
<p>&nbsp;</p></td>
</body>
</html>

Sanjiv RajivAsked:
Who is Participating?
I wear a lot of hats...

"The solutions and answers provided on Experts Exchange have been extremely helpful to me over the last few years. I wear a lot of hats - Developer, Database Administrator, Help Desk, etc., so I know a lot of things but not a lot about one thing. Experts Exchange gives me answers from people who do know a lot about one thing, in a easy to use platform." -Todd S.

niteshnCommented:
Try this... this is your code with some slight changes...
<html>
<head>
<title>Untitled Document</title>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
</head>

<body bgcolor="#CCCCCC" text="#000000">
<td bgcolor=#003366 valign=bottom width=589>
<table border=1 cellspacing=1 cellpadding=5 width="497">
<tr> <td><a style="cursor:hand" onClick="altercontent(1)" href="#no"> Topic 1</a> &nbsp;&nbsp;&nbsp;&nbsp;<a style="cursor:hand" onClick="altercontent(2)" href="#no">Topic 2</a> &nbsp;&nbsp;&nbsp;&nbsp;<a style="cursor:hand" onClick="altercontent(3)" href="#no">Topic 3</a> &nbsp;&nbsp;&nbsp;&nbsp;<a style="cursor:hand" onClick="altercontent(4)" href="#no">Topic 4</a> &nbsp;&nbsp;&nbsp;&nbsp;<a style="cursor:hand" onClick="altercontent(5)" href="#no">Topic 5</a></td></tr>
</table>
<div id="dcontent" style="width:589px;height:28px"></div>
<ilayer id="ns4dcontent" width=589px height=28px left="-1">
<layer id="ns4dcontent2" width=589px height=28px></layer></ilayer>
<script>
//the html contents to display
var mycontent=new Array()
mycontent[1]='Topic 1<br>Topic 1<br>Topic 1<br>Topic 1<br>Topic 1<br>Topic 1<br>Topic 1<br>Topic 1<br>'
mycontent[2]='Topic 2<br>Topic 2<br>Topic 2<br>Topic 2<br>Topic 2<br>Topic 2<br>Topic 2<br>Topic 2<br>'
mycontent[3]='Topic 3<br>Topic 3<br>Topic 3<br>Topic 3<br>Topic 3<br>Topic 3<br>Topic 3<br>Topic 3<br>'
mycontent[4]='Topic 4<br>Topic 4<br>Topic 4<br>Topic 4<br>Topic 4<br>Topic 4<br>Topic 4<br>Topic 4<br>'
mycontent[5]='Topic 5<br>Topic 5<br>Topic 5<br>Topic 5<br>Topic 5<br>Topic 5<br>Topic 5<br>Topic 5<br>'

function altercontent(i){
//if IE 4+
if (document.all)
dcontent.innerHTML=mycontent[i];
//else if NS 4
else if (document.layers){
document.ns4dcontent.document.ns4dcontent2.
document.write(mycontent[i]);
document.ns4dcontent.document.ns4dcontent2.
document.close();
}
//else if NS 6 (supports new DOM)
else if (document.getElementById){
rng = document.createRange();
el = document.getElementById("dcontent");
rng.setStartBefore(el);
htmlFrag = rng.createContextualFragment(mycontent[i]);
while (el.hasChildNodes())
el.removeChild(el.lastChild);
el.appendChild(htmlFrag);
}


}

function beginrotation(){
if (document.all||document.layers||document.getElementById)
setInterval("altercontent(1)")
}
window.onload=beginrotation


</script>
<p>&nbsp;</p></td>
</body>
</html>
0
Sanjiv RajivAuthor Commented:
niteshn,

This is good but
I need to have expanding on NE 4 and NE 6

If you copy this code and look in IE you will see that it's expanding in IE that (yellow tabel)

but In NE 4 and NE 6 it's not expanding
help me please
here is the code

<html>
<head>
<title>Untitled Document</title>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
</head>

<body bgcolor="#CCCCCC" text="#000000">
<td bgcolor=#003366 valign=bottom width=589>
<table border=1 cellspacing=1 cellpadding=5 width="497">
<tr> <td><a style="cursor:hand" onClick="altercontent(1)" href="#no"> Topic 1</a> &nbsp;&nbsp;&nbsp;&nbsp;<a style="cursor:hand" onClick="altercontent(2)" href="#no">Topic 2</a> &nbsp;&nbsp;&nbsp;&nbsp;<a style="cursor:hand" onClick="altercontent(3)" href="#no">Topic 3</a> &nbsp;&nbsp;&nbsp;&nbsp;<a style="cursor:hand" onClick="altercontent(4)" href="#no">Topic 4</a> &nbsp;&nbsp;&nbsp;&nbsp;<a style="cursor:hand" onClick="altercontent(5)" href="#no">Topic 5</a></td></tr>
</table>
<div id="dcontent" style="width:589px;height:28px"></div>
<ilayer id="ns4dcontent" width=589px height=28px>
<layer id="ns4dcontent2" width=589px height=28px></layer></ilayer>
<script>
//the html contents to display
var mycontent=new Array()
mycontent[1]='Topic 1<br>Topic 1<br>Topic 1<br>Topic 1<br>Topic 1<br>Topic 1<br>Topic 1<br>'
mycontent[2]='Topic 2<br>2<br>Topic 2<br>Topic 2<br>Topic 2<br>Topic 2<br>Topic 2<br>'
mycontent[3]='Topic 3<br>Topic 3Topic 3<br>Topic 3<br>Topic 3<br>Topic 3<br>Topic 3<br>'
mycontent[4]='Topic 4<br>ic 4<br>Topic 4<br>Topic 4<br>Topic 4<br>Topic 4<br>Topic 4<br>Topic 4<br>'
mycontent[5]='Topic 5<br>Topic 5<br>T5<br>Topic 5<br>Topic 5<br>Topic 5<br>5<br>'

function altercontent(i){
//if IE 4+
if (document.all)
dcontent.innerHTML=mycontent[i];
//else if NS 4
else if (document.layers){
document.ns4dcontent.document.ns4dcontent2.
document.write(mycontent[i]);
document.ns4dcontent.document.ns4dcontent2.
document.close();
}
//else if NS 6 (supports new DOM)
else if (document.getElementById){
rng = document.createRange();
el = document.getElementById("dcontent");
rng.setStartBefore(el);
htmlFrag = rng.createContextualFragment(mycontent[i]);
while (el.hasChildNodes())
el.removeChild(el.lastChild);
el.appendChild(htmlFrag);
}
}

function beginrotation(){
if (document.all||document.layers||document.getElementById)
setInterval("altercontent(1)")
}
window.onload=beginrotation


</script>
<table width="100%" border="0" cellspacing="0" cellpadding="0" bgcolor="#FFFF66">
<tr><td>This is Expanding in IE <br> Not expanding on NE 4 and 6 Need to have expanding </td></tr>
</table>
<p>&nbsp;</p></td>
</body>
</html>
0
niteshnCommented:
Try this... Though the ilayer content is still cut off in NS4

<html>
<head>
<title>Untitled Document</title>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
</head>

<body bgcolor="#CCCCCC" text="#000000">
<td bgcolor=#003366 valign=bottom width=589>
<table border=0 cellspacing=1 cellpadding=5 width="497">
<tr><td ><a style="cursor:hand" onClick="altercontent(1)" href="#no"> Topic 1</a> &nbsp;&nbsp;&nbsp;&nbsp;<a style="cursor:hand" onClick="altercontent(2)" href="#no">Topic 2</a> &nbsp;&nbsp;&nbsp;&nbsp;<a style="cursor:hand" onClick="altercontent(3)" href="#no">Topic 3</a> &nbsp;&nbsp;&nbsp;&nbsp;<a style="cursor:hand" onClick="altercontent(4)" href="#no">Topic 4</a> &nbsp;&nbsp;&nbsp;&nbsp;<a style="cursor:hand" onClick="altercontent(5)" href="#no">Topic 5</a></td></tr>
<tr> <td>
<div id="dcontent" style="width:589px;height:28px"></div>
<ilayer id="ns4dcontent" width=589px height=28px>
<layer id="ns4dcontent2" width=589px height=28px></layer></ilayer>
</td></tr>
<script>
//the html contents to display
var mycontent=new Array()
mycontent[1]='Topic 1<br>Topic 1<br>Topic 1<br>Topic 1<br>Topic 1<br>Topic 1<br>Topic 1<br>'
mycontent[2]='Topic 2<br>2<br>Topic 2<br>Topic 2<br>Topic 2<br>Topic 2<br>Topic 2<br>'
mycontent[3]='Topic 3<br>Topic 3Topic 3<br>Topic 3<br>Topic 3<br>Topic 3<br>Topic 3<br>'
mycontent[4]='Topic 4<br>ic 4<br>Topic 4<br>Topic 4<br>Topic 4<br>Topic 4<br>Topic 4<br>Topic 4<br>'
mycontent[5]='Topic 5<br>Topic 5<br>T5<br>Topic 5<br>Topic 5<br>Topic 5<br>5<br>'

function altercontent(i){
//if IE 4+
if (document.all)
dcontent.innerHTML=mycontent[i];
//else if NS 4
else if (document.layers){
document.ns4dcontent.document.ns4dcontent2.
document.write(mycontent[i]);
document.ns4dcontent.document.ns4dcontent2.
document.close();
}
//else if NS 6 (supports new DOM)
else if (document.getElementById){
rng = document.createRange();
el = document.getElementById("dcontent");
rng.setStartBefore(el);
htmlFrag = rng.createContextualFragment(mycontent[i]);
while (el.hasChildNodes())
el.removeChild(el.lastChild);
el.appendChild(htmlFrag);
}
}

function beginrotation(){
if (document.all||document.layers||document.getElementById)
setInterval("altercontent(1)")
}
window.onload=beginrotation


</script>
<tr><td bgcolor="#FFFF66">This is Expanding in IE <br> Not expanding on NE 4 and 6 Need to have expanding </td></tr>
</table>
<p>&nbsp;</p></td>
</body>
</html>
0
Ultimate Tool Kit for Technology Solution Provider

Broken down into practical pointers and step-by-step instructions, the IT Service Excellence Tool Kit delivers expert advice for technology solution providers. Get your free copy now.

niteshnCommented:
Try this... Though the ilayer content is still cut off in NS4

<html>
<head>
<title>Untitled Document</title>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
</head>

<body bgcolor="#CCCCCC" text="#000000">
<td bgcolor=#003366 valign=bottom width=589>
<table border=0 cellspacing=1 cellpadding=5 width="497">
<tr><td ><a style="cursor:hand" onClick="altercontent(1)" href="#no"> Topic 1</a> &nbsp;&nbsp;&nbsp;&nbsp;<a style="cursor:hand" onClick="altercontent(2)" href="#no">Topic 2</a> &nbsp;&nbsp;&nbsp;&nbsp;<a style="cursor:hand" onClick="altercontent(3)" href="#no">Topic 3</a> &nbsp;&nbsp;&nbsp;&nbsp;<a style="cursor:hand" onClick="altercontent(4)" href="#no">Topic 4</a> &nbsp;&nbsp;&nbsp;&nbsp;<a style="cursor:hand" onClick="altercontent(5)" href="#no">Topic 5</a></td></tr>
<tr> <td>
<div id="dcontent" style="width:589px;height:28px"></div>
<ilayer id="ns4dcontent" width=589px height=28px>
<layer id="ns4dcontent2" width=589px height=28px></layer></ilayer>
</td></tr>
<script>
//the html contents to display
var mycontent=new Array()
mycontent[1]='Topic 1<br>Topic 1<br>Topic 1<br>Topic 1<br>Topic 1<br>Topic 1<br>Topic 1<br>'
mycontent[2]='Topic 2<br>2<br>Topic 2<br>Topic 2<br>Topic 2<br>Topic 2<br>Topic 2<br>'
mycontent[3]='Topic 3<br>Topic 3Topic 3<br>Topic 3<br>Topic 3<br>Topic 3<br>Topic 3<br>'
mycontent[4]='Topic 4<br>ic 4<br>Topic 4<br>Topic 4<br>Topic 4<br>Topic 4<br>Topic 4<br>Topic 4<br>'
mycontent[5]='Topic 5<br>Topic 5<br>T5<br>Topic 5<br>Topic 5<br>Topic 5<br>5<br>'

function altercontent(i){
//if IE 4+
if (document.all)
dcontent.innerHTML=mycontent[i];
//else if NS 4
else if (document.layers){
document.ns4dcontent.document.ns4dcontent2.
document.write(mycontent[i]);
document.ns4dcontent.document.ns4dcontent2.
document.close();
}
//else if NS 6 (supports new DOM)
else if (document.getElementById){
rng = document.createRange();
el = document.getElementById("dcontent");
rng.setStartBefore(el);
htmlFrag = rng.createContextualFragment(mycontent[i]);
while (el.hasChildNodes())
el.removeChild(el.lastChild);
el.appendChild(htmlFrag);
}
}

function beginrotation(){
if (document.all||document.layers||document.getElementById)
setInterval("altercontent(1)")
}
window.onload=beginrotation


</script>
<tr><td bgcolor="#FFFF66">This is Expanding in IE <br> Not expanding on NE 4 and 6 Need to have expanding </td></tr>
</table>
<p>&nbsp;</p></td>
</body>
</html>
0
Sanjiv RajivAuthor Commented:
niteshn ,

Can you hide and not show in NE 4 ?

And that's all you get 250

Please
Thnaks
0
a1programmerCommented:
This should work better for you...
You don't need the extra CSS on the <A ...>
The hand is automatically the cursor links.

And you can make the href a javascript function as shown above... You were passing the value of the topic into the function, but not using the paramater in the function...

adding the href="#no" sometimes caused the text to disappear.

This works good in IE and NS 4.7, didn't test it in NS 6+.



<html>
<body bgcolor="#CCCCCC" text="#000000">
<script language="javascript">
//the html contents to display
var mycontent=new Array();
mycontent[1]='Topic 1<br>Topic 1<br>Topic 1<br>Topic 1<br>Topic 1<br>Topic 1<br>Topic 1<br>Topic 1<br>';
mycontent[2]='Topic 2<br>Topic 2<br>Topic 2<br>Topic 2<br>Topic 2<br>Topic 2<br>Topic 2<br>Topic 2<br>';
mycontent[3]='Topic 3<br>Topic 3<br>Topic 3<br>Topic 3<br>Topic 3<br>Topic 3<br>Topic 3<br>Topic 3<br>';
mycontent[4]='Topic 4<br>Topic 4<br>Topic 4<br>Topic 4<br>Topic 4<br>Topic 4<br>Topic 4<br>Topic 4<br>';
mycontent[5]='Topic 5<br>Topic 5<br>Topic 5<br>Topic 5<br>Topic 5<br>Topic 5<br>Topic 5<br>Topic 5<br>';

function altercontent(i){
     //if IE 4+
     if (document.all)
               dcontent.innerHTML=mycontent[i];
     //else if NS 4
     else if (document.layers){
               document.ns4dcontent.document.ns4dcontent2.
               document.write(mycontent[i]);
               document.ns4dcontent.document.ns4dcontent2.
               document.close();
     }else if (document.getElementById){     //else if NS 6 (supports new DOM)
          rng = document.createRange();
          el = document.getElementById("dcontent");
          el.innerHtml = 'crap';
          rng.setStartBefore(el);
          htmlFrag = rng.createContextualFragment(mycontent[i]);
          }
     else ;
}
</script>

<table border=1 cellspacing=1 cellpadding=5 width="497">
     <tr><td><a href="javascript:altercontent(1)" > Topic 1</a> &nbsp;&nbsp;&nbsp;&nbsp;<a href="javascript:altercontent(2)">Topic 2</a> &nbsp;&nbsp;&nbsp;&nbsp;<a href="javascript:altercontent(3)">Topic 3</a> &nbsp;&nbsp;&nbsp;&nbsp;<a href="javascript:altercontent(4)">Topic 4</a> &nbsp;&nbsp;&nbsp;&nbsp;<a href="javascript:altercontent(5)">Topic 5</a></td></tr>
</table>

<div id="dcontent" style="width:589px;height:28px"></div>

<ilayer id="ns4dcontent" width=589px height=28px left="-1">
     <layer id="ns4dcontent2" width=589px height=28px></layer>
</ilayer>

</body>
</html>
0
niteshnCommented:
You don't really need to hide it all in NS4. you can probably set the height of the layer. If you still need to disable the whole page for NS4 you can try

<head>
<script language="javascript">
if(navigator.appName=="Netscape" && document.layers)
{
  alert("This page doesnot work with Netscape 4.X- versions")
  window.location = "alternativepageforns4.html"
}
</script>
</head>
<body>
...

Else if you just need to stop this function in NS4 just remove this portion from your code...
 //else if NS 4
 else if (document.layers){
              document.ns4dcontent.document.ns4dcontent2.
              document.write(mycontent[i]);
              document.ns4dcontent.document.ns4dcontent2.
              document.close();
    }
0
Sanjiv RajivAuthor Commented:
niteshn

When i remove this i get error on IE

Else if you just need to stop this function in NS4 just remove this portion from your code...
//else if NS 4
else if (document.layers){
             document.ns4dcontent.document.ns4dcontent2.
             document.write(mycontent[i]);
             document.ns4dcontent.document.ns4dcontent2.
             document.close();
   }


I want to make it work like what this site has it
http://www.attbi.com

Top News businss and sports in center

If you could make this work in all IE and NE 4+
I can live with different approch as long as it works
If you need more points i can do that to 1000 points or 1500 points  
Thanks
0
a1programmerCommented:
Try  mine.
0
Sanjiv RajivAuthor Commented:
a1programmer,

Problem with NE 6 with your code

I want to make it work like what this site has it
http://www.attbi.com

Top News businss and sports in center

If you could make this work in all IE and NE 4+
I can live with different approch as long as it works
If you need more points i can do that to 1000 points or 1500 points  
Thanks
0
niteshnCommented:
You can see that here the height of the content is consistant. You'll have to specify the height of the layer in that case for NS4. For other browsers it'll work fine. Instead of 28px as specified now you should specify the height so as the content fills in fine.
0
niteshnCommented:
You can see that in case of attbi site the height of the content for each menu item is consistant. You'll have to specify the height of the layer in that case for NS4. For other browsers it'll work fine. Instead of 28px as specified now you should specify the height so as the content fills in fine. ie it should be like

<ilayer id="ns4dcontent" width=589px height=200px left="-1">
    <layer id="ns4dcontent2" width=589px height=200px></layer>
</ilayer>

height needs to be increased accroding to the height of the content text you have.
0
Sanjiv RajivAuthor Commented:
niteshn,
Yes I can have the Ilayer hight 200px
But the probelm i am runnig into is
why this is not expanding in NE 4
if you put tabel after </ilayer>
<table width="100" border="0" cellspacing="0" cellpadding="0" bgcolor="#CCFF66">
<tr><td>&test test test tese </td></tr>

and see in NE 4
0
a1programmerCommented:
Your going to have limitations with making it compatible with all brosers..

NS will not shift some things down when other things expand...  The site you gave us as an example demonstrates this perfectly, but there is no dynamic sizing...

0
niteshnCommented:
The auto expand/collapse that happens in IE ans NS6+ will not happen in NS4. It is the default behaviour in the browser that once a layer height is fixed it doesn't change automatically. So if the content is more than the height it is truncated. That is why i suggested thagt you fix the height of the ilayer so that it contains the max content. height of 15px is sufficient for the eg. here. This would eb something you'll have to live with.

The other option would be to change the height of the layer each time you put the content. For this you'll have you estimate a prospective height for each topic and change it using...
document.ns4dcontent.height = "100px"
document.ns4dcontent.document.ns4dcontent2.height="100px"
etc...
0
a1programmerCommented:
I think this works in NS 6 now,  But your not going to be able to get it to resize right....

<html>
<body bgcolor="#CCCCCC" text="#000000">
<script language="javascript">
//the html contents to display
var mycontent=new Array();
mycontent[1]='Topic 1<br>Topic 1<br>Topic 1<br>Topic 1<br>Topic 1<br>Topic 1<br>Topic 1<br>Topic 1<br>';
mycontent[2]='Topic 2<br>Topic 2<br>Topic 2<br>Topic 2<br>Topic 2<br>Topic 2<br>Topic 2<br>Topic 2<br>';
mycontent[3]='Topic 3<br>Topic 3<br>Topic 3<br>Topic 3<br>Topic 3<br>Topic 3<br>Topic 3<br>Topic 3<br>';
mycontent[4]='Topic 4<br>Topic 4<br>Topic 4<br>Topic 4<br>Topic 4<br>Topic 4<br>Topic 4<br>Topic 4<br>';
mycontent[5]='Topic 5<br>Topic 5<br>Topic 5<br>Topic 5<br>Topic 5<br>Topic 5<br>Topic 5<br>Topic 5<br>';

function altercontent(i){
    //if IE 4+
    if (document.all)
              dcontent.innerHTML=mycontent[i];
    //else if NS 4
    else if (document.layers){
              document.ns4dcontent.document.ns4dcontent2.
              document.write(mycontent[i]);
              document.ns4dcontent.document.ns4dcontent2.
              document.close();
    }else if (document.getElementById){     //else if NS 6 (supports new DOM)
          rng = document.createRange();
          el = document.getElementById("dcontent");
          rng.setStartBefore(el);
          htmlFrag = rng.createContextualFragment(mycontent[i]);
          while (el.hasChildNodes())
          el.removeChild(el.lastChild);
          el.appendChild(htmlFrag);
          }
       
    else ;
}
</script>

<table border=1 cellspacing=1 cellpadding=5 width="497">
    <tr><td><a href="javascript:altercontent(1)" > Topic 1</a> &nbsp;&nbsp;&nbsp;&nbsp;<a href="javascript:altercontent(2)">Topic 2</a> &nbsp;&nbsp;&nbsp;&nbsp;<a href="javascript:altercontent(3)">Topic 3</a> &nbsp;&nbsp;&nbsp;&nbsp;<a href="javascript:altercontent(4)">Topic 4</a> &nbsp;&nbsp;&nbsp;&nbsp;<a href="javascript:altercontent(5)">Topic 5</a></td></tr>
</table>

<div id="dcontent" style="background-color:EEEEEE; width:589px;height:228px"></div>

<ilayer id="ns4dcontent" bgColor="#EEEEEE" width=589px height=300px left="-1">
    <layer id="ns4dcontent2" bgColor="#EEEEEE" width=589px height=228px></layer>
</ilayer>

</body>
</html>
0

Experts Exchange Solution brought to you by

Your issues matter to us.

Facing a tech roadblock? Get the help and guidance you need from experienced professionals who care. Ask your question anytime, anywhere, with no hassle.

Start your 7-day free trial
a1programmerCommented:
I meant browsers, not brosers...
0
niteshnCommented:
pls read "height of 15px is sufficient for the eg. here" in my comment as "height of 150px is sufficient for the eg. here"
0
Sanjiv RajivAuthor Commented:
yep Happy!!
0
It's more than this solution.Get answers and train to solve all your tech problems - anytime, anywhere.Try it for free Edge Out The Competitionfor your dream job with proven skills and certifications.Get started today Stand Outas the employee with proven skills.Start learning today for free Move Your Career Forwardwith certification training in the latest technologies.Start your trial today
JavaScript

From novice to tech pro — start learning today.

Question has a verified solution.

Are you are experiencing a similar issue? Get a personalized answer when you ask a related question.

Have a better answer? Share it in a comment.