div:none acting as visibility:hidden in IE problem

Forum Moderators: open

Message Too Old, No Replies

div:none acting as visibility:hidden in IE problem

jibonita

4:32 pm on Jun 1, 2006 (gmt 0)

Hi All

I have the following situation..I have my html page and after the <body> tag i have :

In the js file I create a <div id="d1"> filling it with some text using
document.getElementById('d1').innerHTML = "some div content"

then I set: document.getElementById('d1').style.display="none"

But only the content of the div deiappears and the place that it occupy stays i.e it acts as visibility:hidden.

All this Happens in Internet Explorer for Mac. can anybody tell me why i am getting this bug?

Thanks.

gavacho

4:12 pm on Jun 3, 2006 (gmt 0)

First, I am a little confused.... Your <div> tag is actually in your html document and your a dynamically changing the content within the <div> tag using

document.getElementById('d1').innerHTML = "some div content"

Is this not the case?
When you use

document.getElementById('d1').style.display="none"

you are not changing the content of the <div>, you are only changing the way it is displayed. The content is still there, all you did was make it invisible.

gavacho

4:18 pm on Jun 3, 2006 (gmt 0)

I am not sure what you are trying to do, but if you want to make everyting with the <div> go away, you could use

document.getElementById('d1').innerHTML = ""

jibonita

10:36 am on Jun 8, 2006 (gmt 0)

I want to fill the div with content, then take its height - the height that it gets when i fill it with content, and then i want to make the div disappear.

jshanman

12:55 pm on Jun 8, 2006 (gmt 0)

All this Happens in Internet Explorer for Mac. can anybody tell me why i am getting this bug?

You answered your question before you asked it!

No but seriously...

Have you tried the same script on another browser? If you don't see the same results, then it's a browser bug (yes, that browser has LOTS of those). But if you get the same results on IE (in windows) && firefox, then it's your code.

what is the "position" of this div set to? If it is absolute, then it is acting correctly.

Also, the only height you'll get is one that is set by you in the css code(if it was set). IIRC, you won't be able to get/store the browsers generated height.

- JS

jibonita

1:16 pm on Jun 8, 2006 (gmt 0)

Yes the div has an absolute position. My code doent work only in IE for mac.
Now I have another situation..I have Div -> overflow:hidden. And I have 2 divs in it ->position:absolute. I fill the 2 inner divs with content using innerHTML, but the big Div shows the content twice. If i remove the overflow:hidden, it swows the content once, but i dont need to see whe whole area of the outer div. What is the problem with the overflow?

jshanman

1:29 pm on Jun 8, 2006 (gmt 0)

To answer your first question, that sounds like it is doing the correct thing. If an element is position: absolute, then nothing can be "relative" to it. Meaning display block/none should have no effect on any other element when it is applied to a div with position: absolute.

Overflow:
I have found the overflow to work best for all browsers when a px height/width is given to it in css.

- JS

jibonita

4:19 pm on Jun 8, 2006 (gmt 0)

my div with overflow is created by js function this way:
w = 100;
h = 100;
z = '<div style="overflow:hidden;height='+ h + 'px;width:'+ w +'px;"'>';
document.write(z);

I tried creating it with DOM methods too. The same result. What should i do - give the dive 'class' attribute and define the class in css file or in <style></style> secction?
I'm sorry for my stupid questions, but i'm a newbie.

jshanman

12:56 pm on Jun 9, 2006 (gmt 0)

I'm sorry for my stupid questions, but i'm a newbie.

Never apologize for asking questions. Why would anyone waste their time helping people if they didn't want to?

Anyway, it looks like you are setting everything ok. Giving it a class would actually cause more browser headaces. Is it only on IE for the MAC that you are having problems, or is the same problem on other browsers as well?

- JS

whoisgregg

1:16 pm on Jun 9, 2006 (gmt 0)

Just so we don't forget, Internet Explorer for Mac is a dead product [webmasterworld.com]. A good conversation with different views on supporting/not supporting Mac IE users [webmasterworld.com].

jibonita

2:50 pm on Jun 9, 2006 (gmt 0)

My problem is just with IE for mac

jshanman

2:58 pm on Jun 9, 2006 (gmt 0)

My problem is just with IE for mac

Then it's not a problem with your code. Give up, it may not be possible to fix...

[quirksmode.org...]

This site is known for advanced browser work-arounds, and even he gave up on this browser!

Don't waste your time with something you can't fix.

- JS

visionmonster

8:27 pm on Jun 9, 2006 (gmt 0)

if it's preserving the height of the div when you hide it, you can set the style.height = "1px"; and style.marginHeight = "-1px" the same time you set the style.display = "none";

of course you would have to undo those styles when you display block the code again.

that should mostly get rid of the space except for the 1px; not perfect but may look better.

probably more work than it's worth.

pretty brave to try and support IE5.2 but if you have a lot of OS9 users, there are not many other browsers, i think Camino may still support os9, but I could be wrong on that.