cuestiones jQuery acordeón con IE 6

Question

he implementado un acordeón Jquery en una de mis páginas usando las siguientes opciones

$("#accordion").accordion({ header: "h3", alwaysOpen: false, active: false, autoHeight: false}); 

Esto funciona muy bien en Firefox y en Internet Explorer 7 (now that I've upgraded to v1.7 of jquery ui)

Sin embargo, en IE6, casi todos los contenidos de cada acordeón desaparecen (me queda una sola etiqueta <select> mostrando ?!)

Si cambio la opción AutoHeight a verdadera según this answer, entonces todo está bien nuevamente, excepto que Pierdo el beneficio de tener los acordeones del tamaño adecuado, y algunos de ellos tienen un montón de espacio en blanco.

¿Alguien sabe una solución para que yo pueda tener AutoHeight = false?

Answer 1

Estoy teniendo el mismo problema. El acordeón funciona muy bien con ul, así que encontré este artículo sobre cómo hacer una tabla sin usar.

http://mindrulers.blogspot.com/2008/03/create-table-using-css.html

Espero que esto ayude.

Answer 2

Mi solución para esto fue utilizar autoHeight verdadero para IE6 y falso para todos los demás navegadores.

var autoHeight = false; 
if($.browser.msie && parseFloat($.browser.version) <= 7.0) { autoHeight = true; } 
$("#accordion").accordion({ autoHeight: autoHeight }); 

Answer 3

Enfrentando el mismo problema encontré una solución que funciona en todos los navegadores sin tener que cambiar el parámetro autoHeight.

sólo tiene que añadir una clase a su css de esta manera:

* html .clearfix { height: 1%; } 

Y luego añadirlo a la div de contenido después de la h3 (como este:)

<h3>Header</h3> 
<div class="clearfix">Whatever</div> 

El problema es en realidad un IE6 problema con la representación de texto invisible. Lo he probado en contenido que contiene listas desordenadas y divs anidados complejos y más, todo funciona bien. ¡Avísame si fue el truco!

Answer 4

Añadiendo .ui-accordion-content {zoom: 1; } a mi CSS resuelto el problema para mí:

<link type="text/css" href="css/dark-hive/jquery-ui-1.7.2.custom.css" rel="stylesheet" /> 
<style type="text/css"> 
     .ui-accordion-content{ zoom: 1; } 
</style> 

Answer 5

El problema parece estar relacionado con un error de representación de IE6. Esto solucionó el problema para mí.

// This is required for IE6. 
if (jQuery.browser.msie && jQuery.browser.version.substr(0,1)<7) 
    jQuery('#accordion *').css('zoom', '1');