Search and Top Navigation
#4615 closed bug (fixed)
Opened June 18, 2009 05:06PM UTC
Closed July 14, 2010 01:20PM UTC
Last modified November 19, 2010 06:26PM UTC
Accordion display problems in IE6/7 when parent has a background
| Reported by: | banacan | Owned by: | |
|---|---|---|---|
| Priority: | major | Milestone: | 1.8.3 |
| Component: | ui.accordion | Version: | 1.7.1 |
| Keywords: | Cc: | ||
| Blocked by: | Blocking: |
Description
Whenever an upper panel closes, the lower panel bars remains where they were when the upper panel was open, and they do not return to their correct position until the mouse has hovered over. The lower panels are not open, just the bar is separated from the bar above that was previously opened.
I should note that I have this accordion set as follows:
active: false, autoHeight: true, collapsible: true
This means that the accordion bars are completely disconnected and are floating over content below.
Attachments (0)
Change History (6)
Changed July 09, 2009 01:53PM UTC by comment:1
| component: | ui.core → ui.accordion |
|---|---|
| milestone: | TBD → 1.8 |
Changed July 22, 2009 03:28PM UTC by comment:2
The error occurs if the parent element has a background set. Happens in IE 7 but not in firefox 3.
Eg.
<DIV STYLE="background:white;">
<div ID="accordion">
<h3><a href="#">Section 1</a></h3>
<div>
Section 1 content
</div>
<h3><a href="#">Section 2</a></h3>
<div>
Section 2 content
</div>
<h3><a href="#">Section 3</a></h3>
<div>
Section 3 content
</div>
<h3><a href="#">Section 4</a></h3>
<div>
Section 4 content
</div>
</div>
</DIV>
<SCRIPT LANGUAGE="javascript">
$("#accordion").accordion({autoHeight:false});
</SCRIPT>
Changed July 22, 2009 03:53PM UTC by comment:3
I've found a fix. Just add a width to the parent element :)
<DIV STYLE="background:white;width:100%;">
<div ID="accordion">
<h3><a href="#">Section 1</a></h3>
<div>
Section 1 content
</div>
<h3><a href="#">Section 2</a></h3>
<div>
Section 2 content
</div>
<h3><a href="#">Section 3</a></h3>
<div>
Section 3 content
</div>
<h3><a href="#">Section 4</a></h3>
<div>
Section 4 content
</div>
</div>
</DIV>
<SCRIPT LANGUAGE="javascript">
$("#accordion").accordion({autoHeight:false});
</SCRIPT>
Changed July 14, 2010 01:20PM UTC by comment:4
| resolution: | → fixed |
|---|---|
| status: | new → closed |
| summary: | Accordion display problems in IE6/7 on panel close → Accordion display problems in IE6/7 when parent has a background |
Fixed in 936a9a6.
Changed August 04, 2010 01:19AM UTC by comment:5
| milestone: | 1.9 → 1.8.3 |
|---|