hide/show an iframe ?

[Mel]

i need to have 2 side by side iframes, a link on top of the one will
show/hide the other

can someone help me pleeeeezzzzz ?

 

[Martin Honnen]

i need to have 2 side by side iframes, a link on top of the one will
show/hide the other

An <iframe> element is an element like others, you can (in browsers like
IE 5+, Netscape 6+, Opera 7+) change its CSS display property e.g.
<iframe id="iframe1" src="whatever.html" ...></iframe>

function hideElement (element) {
if (element.style) {
element.style.display = 'none';
}
}

function showElement (element) {
if (element.style) {
element.style.display = '';
}
}

var iframe;
if (document.getElementById && (iframe =
document.getElementById('iframe1'))) {
hideElement(iframe);
}

 

[Mel]

i tried:
<iframe id="ME" src="http://www.yahoo.com" frameborder=1></iframe>

<script>
function hideElement (element) {
if (element.style) {
element.style.display = 'none';
}
}

function showElement (element) {
if (element.style) {
element.style.display = '';
}
}

var iframe;
if (document.getElementById && (iframe = document.getElementById('ME'))) {
showElement(iframe);
}

</script>

<BR><BR>
<a href="#" onclick="javascript:hideElement('ME')">XXXXXXXXXXXX</a><BR><BR>

when i click on the link, the iframe will not hide, can you please help me ?

thanks a lot

 

[Martin Honnen]

i tried:
<iframe id="ME" src="http://www.yahoo.com" frameborder=1></iframe>

<script>
function hideElement (element) {
if (element.style) {
element.style.display = 'none';
}
}

function showElement (element) {
if (element.style) {
element.style.display = '';
}
}



<a href="#" onclick="javascript:hideElement('ME')">XXXXXXXXXXXX</a>

You need to find the right element object of course as the code above showed
<a href="#"
onclick="var iframe;
if (document.getElementById) {
iframe = document.getElementById('ME');
}
if (iframe) {
hideElement(iframe);
}
return false;">...</a>

 

[Mel]

thanks a lot for your help. it works fine.

sorry for the next question, but i am a newbeee

i need my link to display "show" when the iframe is hidden and "hide" when
it is visible. i struggled with it for while and now i have "given up "

if its not a bother, can you put me on the right path ?

thanks again

 

[c.anandkumar]

thanks a lot for your help. it works fine.

sorry for the next question, but i am a newbeee

i need my link to display "show" when the iframe is hidden and "hide" when
it is visible.

Have a span surrounding the anchor text that you would like to change.

<a href="javascript:HideFrame()">Hide Frame</a>

now becomes

<span id="sFrameAnchor"><a href="javascript:HideFrame()">Hide
Frame</a></span>

and
<script language="Javascript">
function HideFrame()
{
var obj = document.getElementById ('sFrameAnchor');
obj.innerHTML = '<a href="javascript:ShowFrame()">Show Frame</a>';
// Set the frame as invisible here - you have the code to do so
return;
}
function ShowFrame()
{
var obj = document.getElementById ('sFrameAnchor');
obj.innerHTML = '<a href="javascript:HideFrame()">Hide Frame</a>';
// Set the frame as visible here - you have the code to do so
return;
}