a better way for show, hide div's...

[cloudseven]

hey there, this is my first post and I'm fairly new to javascript.
What I'm trying to do is show and hide div's depending on the onclick event. I've accomplish this but would like a better way of doing it. I have two hidden div's with iframes in it and I want only one to show at a time. here is my code.


<script type="text/javascript">
var click2

function toggle(wframe,wid,hidew)//WFAME=WHAT IFRAME TO REFRESH, WID=WHICH DIV TO DISPLAY, HIDEW=WHICH DIV TO HIDE
{
//DETERMINE IF THE SAME DIV HAS BE CLICKED, IF SO TOGGLE DISPLAY OR DON'T DISPLAY
if(wid == click2)
{document.all[wid].style.display = 'none'; click2 = ""; return false}

//DISPLAY AND HIDE DIV'S ACCORDING TO VARIABLES
document.all[hidew].style.display = 'none';
document.frames[wframe].location.reload();
document.all[wid].style.display = '';
click2 = wid;
}
</script>



<a href="#" onClick="toggle('datamain2','updates', 'message');"
<a href="#" onClick="toggle('datamain', 'message', 'updates');"

<div id="updates" style="display='none'"><iframe id="datamain2" src="news.asp" width="200" height="150" hspace=0 vspace=0 frameborder=0 scrolling=no></iframe></div>
<div id="message" style="display='none'"><iframe id="datamain" src="external.htm" width="200" height="200" hspace=0 vspace=0 frameborder=0 scrolling=no></iframe></div>



So basically I'm calling the function toggle and passing it which iframe to reload, which div to show and which div to hide. Because I only have two div's right now...it's not too hard, but if I add more div's...I don't want to keep on adding more arguments telling which div's to hide since it might increase. I hope I'm clear on this. I just like to learn a better way of doing this...Thanks.:thumbsup:

[glenngv]

maybe you can get an idea from here (http://codingforums.com/showthread.php?s=&threadid=16617).

and setting CSS properties should be like this:

<div id="updates" style="display:none">

not:

<div id="updates" style="display='none'">

[cloudseven]

hey there glen...thanks for your post. I will try that link your suggested and thanks for the tip on the css property. cheers.

[cloudseven]

ok...I got this to work...one more question though...how do I reference the iframe in the divs? As I would like to refresh the iframe for the specific div.


<script type="text/javascript">
function show(d)
{
var h = 0
for(var i=0;i<iVal.length;i++)
if(d==i)
if(iVal[i].style.display=='none')
{
iVal[i].style.display='block';
}
else
{
iVal[i].style.display='none';
}
else
{
iVal[i].style.display='none';
}
}
</script>




:o

[cloudseven]

nevermind...got it working...:o