Topic: display: none; - how do i hide stuff from NS4? (Page 1 of 1)

I know how to hide stuff from css clients (display: none but what if i want to hide an image from NS4 and other small time non-compliant browsers?

What i want to do is: Display a graphic menu for css clients. The text menu is hidden by display:none;.
Now for NS4 I want to show the text menu (which it will, fine!) and not to show the graphic one.

How would that be done?

<´¯`·.¸ Patric ¸.·´¯`>

display:none?

Shouldn't you be using visibility:none to hide things?

I don't know... should i?

I have seen display:none; in quite a few sources i spied...
Whats the advantages/disadvantages?

<´¯`·.¸ Patric ¸.·´¯`>

NN4: document.layers['layerId'].visibility = "hide" or "show"

IE4: document.all['layerId'].style.visibility = "hidden" or "visible"

DOM: document.getElementById("layerId").style.visibility = "hidden" or "visible"


I'd stay away from display : none because display is used for the display type not really weather you want to display it or not (like display:block or display:inline), I don't know how widely supported it is.

I'll see if I can find the reference, <edit2>found the references</edit2>but as I understand it:

visibility: none; is to hide something, but it remains in the document flow and thus is accounted for in rendering the page. See http://www.w3.org/TR/CSS2/visufx.html#propdef-visibility

display: none; hides something but also removes it from the document flow and is therefore not even thought about in rendering the page. See http://www.w3.org/TR/CSS2/visuren.html#propdef-display


The most common usage of display: none; is to hide things from contemporary browsers, for instance an upgrade your browser message. It would be hidden from current stuff but displayed in NS4 and IE4.

I've used it the other way around, to hide stuff from newer browsers. For instance, in a column of links where I've set display: block;. NS4 doesn't understand that and displays them as wrapped text. Putting a <br> after the link makes it look fine in NS4, but makes it "double-spaced" in contemporary browsers. So I put the <br> inside a <span> class with the span's display set to none in the @import'ed stylesheet. Works like a charm.

I'm working on another one (which I may need help on later) where I have an image class set to display: none; in the linked stylesheet so older browsers will ignore it. Then in the @import'ed stylesheet that image class is positioned absolutely, which of course raises hell with old browsers.

<edit>
I just re-read the original post. That's pretty much what I'm doing in the second example above. Only I'm doing it as a variation on Eric Meyer's Pure CSS Popups. I have a background image that NS4 users see (it's even a home page link!)and in a contemporary browser, hovering on links pops up a different image over the background one. See the page header links at http://www.wab.org/ . It's working well enough that the client approved it for production but the associated links quiver a bit under IE5.5 & 6(Win), which is the problem I may need help with.
</edit>

"the most incredible feats are often accomplished by
those who have had the most incredible challenges"

[This message has been edited by brucew (edited 10-04-2002).]

[This message has been edited by brucew (edited 10-04-2002).]

The OzoneAsylum FaqWiki would like to point you to this page:

http://faq.ozoneasylum.com/751/ - How do I toggle the visibility of layers?

Enjoy and keep expanding me!

ITS ALIVE

FAQ: That's nice that it's in the FAQ, but why would a CSS topic be filed under DHTML? I'd never have found it there--probably because I'm never have looked there.

"the most incredible feats are often accomplished by
those who have had the most incredible challenges"

brucew: I'll answer for my boy (I'm feeling awfully like Doctor Frankenstein - actually I'm more of an Igor to TP's Frankenstein ) as I suspect hes not the chatty sort.

Its under DHTML/JavaScript because you have because you to use it to toggle the visibility and all the threads where this topic has come up (see the list) are from the DHTML/JavaScript forum (but I'm not telling you something you don't already know ).

It had to go in one or the other one and I thought that was the most appropriate place. If everyone thinks its in the wrong one we can move it.

___________________
Emps

FAQs: Emperor

Oh my god, a self-promoting FAQ - there's really no day without a crazy thing happening in here.

kuckus (cell #282)

Quite.

quote:

---

Oh my god, a self-promoting FAQ

---

Let's hope it's not also self-replicating. <shudder>

quote:

---

but I'm not telling you something you don't already know

---

Thanks for being gracious, but don't be so sure. I wouldn't know a DHTML if one reared up and bit me in the arse. Well, not quite that, but I think it was sometime in the mid 80s that I fried the part of my brain that that understands (understood?) programming languages. I look at all the stuff happening these days and I run screaming from the room.

"the most incredible feats are often accomplished by
those who have had the most incredible challenges"

brucew, DHTML is the trem given to using Javascript to set CSS properties on the fly. Why is why it's called Dynamic HTML, hence your Dynamically changing the CSS of an HTML page. Dig?

Drac: Thanks. Well I'm not quite so daft as I sometimes make myself out to be. I know what it's used for even if I seem to be unable to learn how to use it. Sorry to throw you on that.

Dynamically manipulating stylesheet rules is but one of many things you can do with DHTML. Using CSS, though, does not require using DHTML. Thus, I would not have thought to look under DHTML to find a basic reference for CSS. I may, in fact, be the only one who sees it that way since I can understand why it would be convenient for DHTML jockeys to have CSS references nearby since it's something you can mess with using DHTML.

See? Fully circular logic.

"the most incredible feats are often accomplished by
those who have had the most incredible challenges"

You can't expect anything to be where you didn't put it. =)

Keep expanding me!



[This message has been edited by FAQ (edited 10-05-2002).]

~slaps FAQ~

You lazy bitch, get back to work!

Seeing the huge entanglements in an inmate?s understanding of its underlying concepts, the OzoneAsylum FaqWiki would like to try and put things into the right light by quoting Father Prime?s colleague Emperor on that matter:

quote:

---

This FAQ can only be as good as you make it.

---

The inmate will surely understand that, as a result of that, the FaqWiki itself can?t possibly make any changes to its entries, no matter how hard it tries.

I'm getting all emotional - look at the little fella. Hes walking and talking all by himself.

Is this how the 'Terminator scenario' starts?

___________________
Emps

FAQs: Emperor

quote:

---

Hes walking and talking all by himself.

---

Hehe. That's really amazing.

kuckus (cell #282)