toggle() doesn't really toggle CSS "display" value

[cFreed]

When an element:

• has CSS "display: block"
• but is currently hidden, since it is a child of a hidden parent

Then toggle does NOT change its CSS to "display: none".

This behaviour finally conforms to what the doc says: <<If the element is initially displayed, it will be hidden; if hidden, it will be shown>>

But it is ambiguous, since we might expect toggle() to merely substitute none to display and vice-versa. Here is an example where this alternative behaviour should be preferred: ​http://jsfiddle.net/bT2uE/.

Don't know if it is bug or feature...

Thanks for your attention.

[Rick Waldron]

toggle is a shorthand to hide/show or vice versa and those functions look at the element's current display value and proceed accordingly. The overhead of checking parent elements would be vastly inefficient. This seems more like question for SO or the forums.

[cFreed]

Replying to rwaldron:

The overhead of checking parent elements would be vastly inefficient.

I really don't understand: you seem to be responding to THE EXACT OPPOSITE of what I said!

What I noticed means that, with its current behaviour, toggle() IS checking parent elements. And it is what I consider to be a problem.

In my opinion, the most obviously expected behaviour of toggle() should be to set "display: none" when it founds "display: block", no matter the element is currently hidden or not.

toggle is a shorthand to hide/show or vice versa and those functions look at the element's current display value and proceed accordingly.

I totally agree. So toggle() should work exactly as hide() does when current state is "display: block", no? But it does NOT, as clearly demonstrated here: ​http://jsfiddle.net/bT2uE/.

Thanks for your attention.

[Rick Waldron]

If you remove style="display:display;" from the innermost UL the list behaves as expected.

​http://jsfiddle.net/rwaldron/bT2uE/1/

[cFreed]

Replying to rwaldron:

If you remove style="display:display;" from the innermost UL the list behaves as expected.

​http://jsfiddle.net/rwaldron/bT2uE/1/

Not at all.

Sorry for the erroneous code you pointed, but correcting it does not change anything.

In the other hand, you may look at this different and simpler example (​http://jsfiddle.net/PHttV/4/), which probes that:

• toggle() does NOT change "display:block" to "display:none" on a hidden element
• while hide() does

[Crystark]

[REOPEN PLEASE]

I'm having the same problem here. Could you take an other look at this problem ?

cFreed is right by explaining : Try to ".toggle()" an element that has "display:block" but is child of an element with "display:none". It's display status doesn't change to "display:none" and thus, when the parent appears, it's still visible.

Now try to apply ".hide()" on the element : it works.

The selector ":hidden" you're using in the toggle function returns true if the element has "display:block" and a parent "display:none". Shouldn't the toggle function use (affectedElement.css('display') != 'none') to see what function "toggle()" should call ?