Tengo un sitio que utiliza mucho jQuery y CSS para lograr algunos efectos bastante agradables. Las páginas funcionan perfectamente en FF y Chrome; sin embargo, en IE9 (y posiblemente en otras versiones de IE) parece que mis páginas no están formateadas correctamente debido a que el navegador aparentemente ignora mis propiedades position:fixed;. Supongo que mi pregunta es: ¿qué podría causar esto (más o menos globalmente en mi sitio)? Sé que es difícil decirlo sin un ejemplo completo de código, pero me preguntaba si alguien ha visto esto antes. No es mucho de CSS, así que no estoy muy seguro de lo que es relevante para publicar y lo que no. Si se necesita más código, házmelo saber.posición: interrupciones fijas en IE9
Ejemplo 1: Barra de herramientas de la ventana de inicio, que imita botón de menú
En el ejemplo siguiente, verá he implementado una barra de herramientas que imita el comportamiento del botón de Inicio de Windows. Se encuentra en la esquina inferior izquierda y, al hacer clic, se expande para mostrar el contenido. Esta funcionalidad funciona muy bien en Ch/FF, pero como puede ver en IE9, la barra de herramientas y su contenido se anexan al final de la página. Arreglé un rápido JSFiddle usando este método en IE9 y parece funcionar bien ... No estoy seguro de qué podría ser diferente de mi documento que hace que deje de funcionar.
The Odd cosa: si cambio de la CSS para position:absolute;, el div se coloca correctamente y de la función correctamente el 99% - simplemente no desplazarse con la página.
#floatingOptions{
background:#fff;
border-right:2px solid #000;
border-bottom:2px solid #000;
bottom:0px;
display:none; /*this gets shown via javascript */
left:0px;
overflow:hidden;
position:fixed;
width:250px;
z-index:99999;
}
Ejemplo 2: Modal de Windows a través de jQuery Herramientas de superposición
Muchos de mis ventanas modales se generan utilizando jQuery Tools Overlay. Nuevamente, esto funciona bien en Ch/FF pero IE9 nuevamente agrega el div modal al final de la página (sin mencionar aparentemente ignorar el índice z).
ACTUALIZACIÓN
aquí está mi DOCTYPE html/declaraciones
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xmlns:fb="http://www.facebook.com/2008/fbml">
SOLUCIÓN
lo he descubierto. Fue un error POBKAC (el problema ocurrió entre el teclado y la silla).
mi <!DOCTYPE....> se está llamando en header.php y que estaba siendo tonto y hacer esto en algunas páginas ..
<style type="text/css">
@import url(/themes/pn5/jquery.ui.all.css);
@import url(/qtip/jquery.qtip.css);
</style>
<?php include ('header.php'); ?>
por lo que los estilos estaban siendo colocados en el código antes de la <!DOCTYPE> fue declarado. lo cambió y el problema desaparece.
¡Gracias a todos!
[Preguntado aquí] (http://stackoverflow.com/questions/6694517/ie9-and-position-fixed), pero es posible que no responda esta pregunta. – Alex
@Alex: Probablemente sea la respuesta. – thirtydot
No estoy seguro de que sea así. Ver actualización arriba. mi doctype está ahí. – Dutchie432