javascript - polyfill - iframe shimming o ie6(y abajo) seleccione el error z-index

polyfill react

Question

Uhm, no estoy seguro si alguien ha encontrado este problema
una breve descripción es en IE6 cualquier objeto <select> se muestra sobre cualquier otro elemento, incluso div''s ... lo que significa que tiene un efecto de javascript que muestra un div que se supone que está encima de todo (por ejemplo: lightbox, multibox, etc. ..) al hacer clic en un elemento determinado y ese div se superpone con <select> su div get para que se muestre como si estuviera debajo de <select> [en este caso un máximo y mínimo índice z no funciona]

Intenté buscar en Google y encontré la solución iframe shim
pero quería algunas alternativas bastante limpias o mejor aún ¿alguien ha encontrado una mejor solución? ya que el método que usa iframes utiliza alrededor de 130 mb de ram puede ralentizar las máquinas de personas pobres

Answer 1

Antes de IE7, la lista desplegable era un control "en ventana", lo que significa que se representaba como un control directamente por Windows en lugar de que el navegador lo sintetizara. Como tal, no fue posible para soportar la indexación z contra otros controles sintetizados.

Para aparecer sobre un DDL, debe usar otro control con ventana, como IFRAME. También puede usar una característica poco conocida de solo IE llamada window.createPopup () que esencialmente hace una ventana emergente sin bordes. Tiene limitaciones, como un clic imparable, pero en realidad son bastante útiles si está construyendo un sistema de menú flotante.

Answer 2

Hay un complemento para jquery llamado bgiframe que hace que el método iframe sea bastante fácil de implementar.

Personalmente, como desarrollador web, llegué al punto en el que ya no me importa la experiencia del usuario en IE6. Lo haré renderizar lo más cerca posible de "correcto", y me aseguraré de que sea funcional, pero en lo que respecta a la velocidad, es una lástima. Ellos pueden actualizarse IE7 (aunque sigue siendo bastante lento, en comparación con cualquier otro navegador) ha estado fuera durante 2 años (¡casi al día!). IE8 saldrá en breve. Firefox está disponible para todas las plataformas. Safari también es una opción (y súper rápido). Opera está disponible para la mayoría de las plataformas.

IE6 se lanzó hace más de 7 años. En mi humilde opinión, no hay ninguna razón para seguir usándolo, aparte de los usuarios perezosos y los departamentos de TI incompetentes (o si eres un desarrollador web).

Answer 3

También está el método activex, que estoy empezando a explorar. Requiere la creación de un código condicional para usar un control activex en lugar de un cuadro de selección para ie6. Hay una secuencia de comandos de demostración que muestra la técnica, que se analiza con más detalle aquí .

Actualización: parece que se requiere MS Office para que el control x activo esté en la máquina del usuario. En teoría, podría ser posible incluir eso en alguna parte, de alguna manera, pero eso se está volviendo mucho más complicado.

Answer 4

La solución más simple y elegante a ese molesto error de IE se encuentra en: http://docs.jquery.com/Plugins/bgiframe usando jQuery.

Llegué a esa conclusión después de probar durante 2 días para que funcione con WebSphere Portal / Portal Applications, donde todo es dinámico, incluido el menú desplegable.

Answer 5

Sé que muchas personas sugirieron sus propios consejos, pero en mi caso, simplemente oculto seleccionar usando jquery como el de abajo.

$('':date'').dateinput({
    format: ''dd/mm/yyyy'',
    onBeforeShow: function(event) {
        $(''select'').hide();
    },
    onHide: function(event) {
        $(''select'').show();
    }
});

Answer 6

No tiene que ocultar cada select con un bucle. Todo lo que necesitas es una regla CSS como:

* html .hideSelects select { visibility: hidden; }

Y el siguiente JavaScript:

//hide:
document.body.className +='' hideSelects''

//show:
document.body.className = document.body.className.replace('' hideSelects'', '''');

(O bien, puede usar su addClass favorita de addClass / removeClass ).

Answer 7

en caso de que alguien esté interesado, aquí hay un código de ajuste de IE.

* html .shimmed {
    _azimuth: expression(
        this.shimmed = this.shimmed || ''shimmed:''+this.insertAdjacentHTML(''beforeBegin'',''<iframe style="filter:progid:DXImageTransform.Microsoft.Alpha(style=0,opacity=0);position:absolute;top:0px;left:0px;width:100%;height:100%" frameBorder=0 scrolling=no src="javascript:false;document.write(''+"''''"+'');"></iframe>''),
        ''inherit'');
}

ref: esta esencia por sutilGradient y esta publicación de Zach Leatherman