Opened 8 years ago

Closed 7 years ago

Last modified 7 years ago

#4615 closed bug (fixed)

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.

Change History (6)

comment:1 Changed 8 years ago by Jörn Zaefferer

Component: ui.coreui.accordion
Milestone: TBD1.8

comment:2 Changed 8 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 8 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 7 years ago by Scott González

Resolution: fixed
Status: newclosed
Summary: Accordion display problems in IE6/7 on panel closeAccordion display problems in IE6/7 when parent has a background

Fixed in 936a9a6.

comment:5 Changed 7 years ago by Scott González

Milestone: 1.91.8.3

comment:6 Changed 7 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.