Opened 10 years ago

Closed 9 years ago

Last modified 9 years ago

#5421 closed bug (fixed)

Accordion header margins disappear in IE 8

Reported by: ji1337 Owned by:
Priority: major Milestone: 1.8.8
Component: ui.accordion Version: 1.8
Keywords: accordion, margin, internet explorer 8, ie 8 Cc:
Blocked by: Blocking:

Description

The default accordion as shown in http://jqueryui.com/demos/accordion/ has a display issue under Internet Explorer 8. I haven't tested under IE 6 & 7.

When expanding a panel, the margin above the header of the expanded panel is ignored, therefore the expanded panel collides with the previous panel. Somehow the problem goes away when hovering the mouse in and out of the header of the expanded panel.

Change History (7)

comment:1 Changed 9 years ago by Scott González

Milestone: TBD1.9
Priority: minormajor

comment:2 Changed 9 years ago by m4olivei

I'm having this same issue on a site I'm developing and have seen at least one post directly related. Here is the example I am dealing with:

http://vibro.websitebeta.net/application-solutions/roof-top-units

Here is the post I stumbled across:

http://forum.jquery.com/topic/problem-with-margin-top-for-first-accordion-header-in-ie8

Any progress on this bug?

Thanks, Matt

comment:3 Changed 9 years ago by m4olivei

After a bit of playing around, I found a workaround. I set a change event for the accordion to trigger a blur on my accordion headers. eg:

$("#accordion").accordion({
  active: false, 
  autoHeight: false, 
  collapsible: true, 
  change: function() { 
    $(this).find('h3').blur(); 
  }
});

That got rid of the disappearing margins issue.

comment:4 Changed 9 years ago by Alex Dovenmuehle

Resolution: fixed
Status: newclosed

Accordion: Fixed weird behavior on accordion animations in IE. Fixed #5421 - Accordion header margins disappear in IE 8

Changeset: 497ec8588c177645082ab9ac08972b16afd1b3e8

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

Milestone: 1.91.8.8

comment:6 Changed 9 years ago by perosb

this "fix" seem to break accordions;

"Uncaught TypeError: Cannot read property 'className' of undefined"

jquery-ui.js:6035 this.toHide.parent()[0].className = this.toHide.parent()[0].className;

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

That error has already been fixed.

Note: See TracTickets for help on using tickets.