problem with style.display="none" in NN7

A

Andy Fish

Hi,

I have a section of a web page that I want to be able to make appear and
disappear with javascript, with the things below it moving up and down as
appropriate. I'm not using absolute positioning or anthing fancy. I put the
aforementioned section in a div:

<div id="foo">
... optional stuff in here
</div>

when I want to hide it, I do this:

document.getElementById("foo").style.display="none";

and to show it again I do this:

document.getElementById("foo").style.display="inline";

This works fine in IE6 and Opera, but I have a problem with NN7. When the
page comes up it's visible. the first time I hide it, it works fine, then I
show it again and it works, the second time I try to hide it, nothing
happens - the display style gets set to 'none' but the div is still visible
on the page.

if the div contains only text (no tags at all), it works OK every time.

Can anybody throw any light on this or suggest possible workarounds?

Many thanks

Andy
 
K

Klaus Krtschil

Andy said:
Hi,

I have a section of a web page that I want to be able to make appear and
disappear with javascript, with the things below it moving up and down as
appropriate. I'm not using absolute positioning or anthing fancy. I put the
aforementioned section in a div:

<div id="foo">
... optional stuff in here
</div>

when I want to hide it, I do this:

document.getElementById("foo").style.display="none";

and to show it again I do this:

document.getElementById("foo").style.display="inline";

This works fine in IE6 and Opera, but I have a problem with NN7. When the
page comes up it's visible. the first time I hide it, it works fine, then I
show it again and it works, the second time I try to hide it, nothing
happens - the display style gets set to 'none' but the div is still visible
on the page.

if the div contains only text (no tags at all), it works OK every time.

Can anybody throw any light on this or suggest possible workarounds?

Many thanks

Andy
Click to expand...

Can you provide a link? That would help a lot.

Klaus
 
A

Andy Fish

here's a complete stand-alone example:

<HTML><head><script language="javascript">
function Button1_onclick()
{document.getElementById("foo").style.display="none";}
function Button2_onclick()
{document.getElementById("foo").style.display="inline";}
</script></head>
<BODY>
<p>this is always visible</p>
<div id="foo"><p>this is sometimes visible</p></div>
<P>
<INPUT id="Button1" type="button" value="Button" name="Button1"
onclick="return Button1_onclick()">
<INPUT id="Button2" type="button" value="Button" name="Button2"
onclick="return Button2_onclick()">
</P>
</BODY>
</HTML>

click on the left button to make the text disappear and the right button to
make it appear. on Netscape 7 it only works once then it stays visible all
the time. other browsers seem to work OK.
 
L

Lee

Andy Fish said:
here's a complete stand-alone example:
[...]
click on the left button to make the text disappear and the right button to
make it appear. on Netscape 7 it only works once then it stays visible all
the time. other browsers seem to work OK.
Click to expand...

It works fine for me in Netscape 7.1.
What messages do you see in the JavaScript console?
 
R

Robert E. Boughner

Makes sense since DIV is a block element whereas plain text is an inline
element.

Andy said:
fixed it (I think)

using the darwinian theory of natural selection, I tried making random
changes to the code to see if it would make any difference

turns out that using style.display="block" to make it visible (rather than
"inline" works OK).

Andy
Click to expand...
 
A

Andy Fish

I have netscape 7.01 - nothing was coming out on the JS console

so maybe it was a bug and my fix was infact a workaround.

Lee said:
Andy Fish said:
here's a complete stand-alone example:
[...]
click on the left button to make the text disappear and the right button to
make it appear. on Netscape 7 it only works once then it stays visible all
the time. other browsers seem to work OK.
Click to expand...

It works fine for me in Netscape 7.1.
What messages do you see in the JavaScript console?
Click to expand...
 
K

Klaus Krtschil

Andy said:
fixed it (I think)

using the darwinian theory of natural selection, I tried making random
changes to the code to see if it would make any difference

turns out that using style.display="block" to make it visible (rather than
"inline" works OK).

Andy


here's a complete stand-alone example:

<HTML><head><script language="javascript">
function Button1_onclick()
{document.getElementById("foo").style.display="none";}
function Button2_onclick()
{document.getElementById("foo").style.display="inline";}
</script></head>
<BODY>
<p>this is always visible</p>
<div id="foo"><p>this is sometimes visible</p></div>
<P>
<INPUT id="Button1" type="button" value="Button" name="Button1"
onclick="return Button1_onclick()">
<INPUT id="Button2" type="button" value="Button" name="Button2"
onclick="return Button2_onclick()">
</P>
</BODY>
</HTML>

click on the left button to make the text disappear and the right button
to

make it appear. on Netscape 7 it only works once then it stays visible all
the time. other browsers seem to work OK.
Click to expand...
Both variants (block/inline) work with Moz 1.4 (Linux)

Klaus
Click to expand...
 

Ask a Question

Want to reply to this thread or ask your own question?

You'll need to choose a username for the site, which only take a couple of moments. After that, you can post your question and our members will help you out.

Ask a Question

Similar Threads

Need help , Having problem with Drag n Drop ? 9
Javascript and div's with style.display=none or block bugging in IE 5.5 and 6.0 2
Need help , Having problem with Drag n Drop... 1
Help with code 0
Help with my responsive home page 2
style.display cross browser problem 1
Javascipt problem. 22
Only one table shows up with the information 2

Members online

No members online now.
Total: 78 (members: 0, guests: 78)
Robots: 422

Forum statistics

Threads
473,995
Messages
2,570,230
Members
46,819
Latest member
masterdaster

Latest Threads

Top