Skip to main content

Bug Tracker

Side navigation

#6999 closed bug (duplicate)

Opened September 03, 2010 08:36PM UTC

Closed October 04, 2010 09:38PM UTC

Last modified March 13, 2012 09:25PM UTC

jQuery.fn.show() changes "display" style when inline

Reported by: chrisobrien Owned by:
Priority: undecided Milestone: 1.4.3
Component: core Version: 1.4.2
Keywords: show hide Cc:
Blocked by: Blocking:
Description

Visit http://jsfiddle.net/GG8FD/ for a demonstration of this bug.

When jQuery.fn.show() is called on an element that is not hidden and that element has an inline CSS "display" style (as shown below), show() sets the "display" to "block":

<div id="cell" style="display:table-cell"></div>

<script type="text/javascript">

alerts "table-cell"

alert($("#cell").css("display"));

$("#cell").show();

alerts "block"

alert($("#cell").css("display"));

</script>

However, when show() is called on an element that is not hidden and that element has its "display" set in a stylesheet, show() does not change its "display":

<style type="text/css">

#cell {

display:table-cell;

}

</style>

<div id="cell"></div>

<script type="text/javascript">

alerts "table-cell"

alert($("#cell").css("display"));

$("#cell").show();

alerts "table-cell"

alert($("#cell").css("display"));

</script>

Expected result: first example (inline "display" style) should not change the "display" to "block" and instead should behave the same as second example ("display" in stylesheet).

Attachments (0)
Change History (2)

Changed September 24, 2010 10:39AM UTC by jaakko.salomaa comment:1

Also, jQuery.fn.show() sets the element.style.display value to "" if getComputedStyle() fails, which it sometimes does in Firefox if used in a currently hidden frame. The following happens in show():

var old = jQuery.data(this[i], "olddisplay");

old -> null

this[i].style.display = old || "";

this[i].style.display -> ""

if ( jQuery.css(this[i], "display") === "none" ) { ... }

This block doesn't get executed because somewhere along jQuery.fn.css() call tree, getComputedStyles() fumbles.

// Set the display of the elements in a second loop
// to avoid the constant reflow
for ( var j = 0, k = this.length; j < k; j++ ) {
    this[j].style.display = jQuery.data(this[j], "olddisplay") || "";
}

this[j].style.display -> "" for a second time

In certain cases, this causes the element either to remain hidden or to eve disappear if it wasn't previously hidden.

Changed October 04, 2010 09:38PM UTC by snover comment:2

priority: → undecided
resolution: → duplicate
status: newclosed

Duplicate of #2185.