...

View Full Version : Hide more than one Iframe



skool h8r
10-22-2005, 09:17 PM
hi all,
I'm currently working on a new website design and i've nearly finished but i am having a real problem with an effect i am trying to achieve. Here's the idea; i have 2 iframes on my page, one for navigation and one for details of the curent page. I've found a script that will allow me to hide one iframe by using radio buttons (hide and show) but no matter what i try, it just will not allow me to have more than one 'copy' of this script in the coding. I want to be able to hide and show each iframe individualy. Here's the code i'm using:


<script>
function show(state){
tag = document.getElementsByTagName("IFRAME");

for(i=0; i<document.DetailForm.RadioDetail.length; i++){
if(document.DetailForm.RadioDetail[i].checked == true){
for(x=0; x<tag.length; x++){
if(tag[x].name == "detailload"){
tag[x].style.display = state
}
}
}
}
}

function show(state){
tag = document.getElementsByTagName("IFRAME");

for(i=0; i<document.DetailForm.RadioNavi.length; i++){
if(document.DetailForm.RadioNavi[i].checked == true){
for(x=0; x<tag.length; x++){
if(tag[x].name == "NaviFrame"){
tag[x].style.display = state
}
}
}
}
}


</script>
<form name="DetailForm" id="DetailFormID" method="post" action="">
<p>
<label>
<input type="radio" name="RadioDetail" value="Hide" onclick="show('none')" />
Hide Details</label>
<br />
<label>
<input type="radio" name="RadioDetail" value="Show" onclick="show('block')" />
Show Details</label>
<br />
</p>


<form name="NaviForm" id="NaviFormID" method="post" action="">
<p>
<label>
<input type="radio" name="RadioNavi" value="Hide" onclick="show('none')" />
Hide Navi</label>
<br />
<label>
<input type="radio" name="RadioNavi" value="Show" onclick="show('block')" />
Show Navi</label>
<br />
</p>

The navigation Iframe is called NaviFrame and the details Iframe is called detailload. The script above has both mixed in but i've also tried them seperate from each other which also failed. I have tried almost everything logical with this script and nothing seems to work. Can you help me?

If there isn't a solution, could someone please tell me how to create 2 buttons that toggle a hide/show 'effect' each Iframe individually?

Thanks,
Scott.

vwphillips
10-22-2005, 09:44 PM
<script>
function show(state){
tag = document.getElementsByTagName("IFRAME");

tag[0] is the first IFRAME
tag[1] is the second IFRAME

so

tag[1].style.visibility='hidden';
tag[0].style.visibility='visible';
if (document.DetailForm.RadioDetail[i].checked){
tag[0].style.visibility='hidden';
tag[1].style.visibility='visible';
}

skool h8r
10-22-2005, 10:17 PM
wow, that was quick!

Thanks,
Scott.



EZ Archive Ads Plugin for vBulletin Copyright 2006 Computer Help Forum