Ticket #4615 (closed bug: fixed)

Opened 5 years ago

Last modified 3 years ago

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:
Blocking: Blocked by:

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.

Change History

comment:1 Changed 5 years ago by joern.zaefferer

  • Component changed from ui.core to ui.accordion
  • Milestone changed from TBD to 1.8

comment:2 Changed 5 years ago by RedNinja

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>

comment:3 Changed 5 years ago by RedNinja

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>

comment:4 Changed 4 years ago by scott.gonzalez

  • Status changed from new to closed
  • Resolution set to fixed
  • Summary changed from Accordion display problems in IE6/7 on panel close to Accordion display problems in IE6/7 when parent has a background

Fixed in  936a9a6.

comment:5 Changed 4 years ago by scott.gonzalez

  • Milestone changed from 1.9 to 1.8.3

comment:6 Changed 3 years ago by Scott González

Accordion: Default accordion to 100% width. Fixes #4615 - Accordion display problems in IE6/7 on panel close.

Changeset: 936a9a6d9ccd676ee53bf029ee336773ba16697d

Note: See TracTickets for help on using tickets.