I've got this bit of css/javascript/html that uses jQuery 1.5 and jQuery-ui 1.8.9. It's a fairly basic view. A top panel of metadata that pertains to the stuff in a lower div. The top panel opens and closes using the "blind" effect.
Here is the code snippet: jsfiddle example
Everything works fine on Chrome & firefox. On IE it doesn't "blind" open...it just toggles to visible. When closing it, it blinds closed but then the entire page flashes once.
I don't know why this happens. I can find no references to such behavior in my searches. It's possible my Google-fu is weak today.
Anyone have any ideas on how to make it play nice in IE? Unfortunately I can't mandate that we don't support I.E.
Remove the position: relative attribute from '.toggle-handle' in the CSS. Seems to solve things for me.
Incidentally, you can hide the #hideable-content div in CSS and simplify your JavaScript code to the following:
$(function() {
// set effect from select menu value
$("#toggle-handle").click(function() {
$("#hideable-content").slideToggle(500);
return false;
});
});