Side navigation
#1349 closed bug (fixed)
Opened July 03, 2007 01:02PM UTC
Closed February 16, 2009 03:52PM UTC
.is(':visible') is incorrect when parent element is hidden
| Reported by: | arrix | Owned by: | john |
|---|---|---|---|
| Priority: | major | Milestone: | 1.3.2 |
| Component: | selector | Version: | 1.3.1 |
| Keywords: | Cc: | ||
| Blocked by: | Blocking: |
Description
What should the :visible test return when the parent element is hidden(display: none)?
The result in safari is different from that in other major browsers.
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>.is(':visible')</title>
<script type="text/javascript" src="jquery.js"></script>
</head>
<body>
<div style="display:none">
<div id="div1"></div>
</div>
<script type="text/javascript">
alert($('#div1').is(':visible'));
</script>
</body>
</html>
IE: true
Firefox: true
Opera: true
Safari: false
Webkit nightly: false
This inconsistency also affects methods using .filter(':visible') such as .hide().
Attachments (0)
Change History (8)
Changed July 03, 2007 02:44PM UTC by comment:1
Changed July 20, 2007 09:05PM UTC by comment:2
The solution to this issue is best dealt with on a case by case basis because of the performance hit. One would need to walk up the DOM tree and check the parents for visibility in Safari.
Changed July 21, 2007 01:45PM UTC by comment:3
| owner: | → john |
|---|
Changed July 29, 2007 07:20PM UTC by comment:4
Changed July 29, 2007 11:02PM UTC by comment:5
Fixed in SVN rev [2518-2519].
Changed July 29, 2007 11:02PM UTC by comment:6
| resolution: | → fixed |
|---|---|
| status: | new → closed |
Changed September 27, 2007 06:24PM UTC by comment:7
| resolution: | fixed |
|---|---|
| status: | closed → reopened |
This bug/feature causes another issue when using the .resizeable() function of jQuery.ui
If the parent div is display:none, then
$('#div1').resizeable({ proportionallyResize: ['div'] });
On resize the internal div is incorrectly resized. This is due to an incorrect assumption that when $(an_element).is(':visible') returns true, $(an_element) has an outterWidth and outterHeight. See http://dev.jquery.com/browser/tags/1.2.1/src/core.js#L647
Changed February 16, 2009 03:52PM UTC by comment:8
| component: | core → selector |
|---|---|
| milestone: | 1.1.4 → 1.3.2 |
| resolution: | → fixed |
| status: | reopened → closed |
| version: | 1.1.3 → 1.3.1 |
Fixed in SVN rev [6210].
It isn't jquery's fault.
It is caused by that in safari window.getComputedStyle($('#div1')[0]).display == 'none'.
The behavior of .is(':visible') in safari is correct conceptually. But I think, for most of programmers, the behavior in firefox/opera/ie is more desired.