2008-11-22 15 views
12

En Firefox y Safari, las páginas que están centradas se mueven unos pocos píxeles cuando la página es lo suficientemente larga para que aparezca la barra de desplazamiento. Si navega por un sitio que tiene páginas largas y cortas, la página parece "saltar".Páginas largas en offset de FireFox cuando aparece la barra de desplazamiento

IE7 tiende a dejar la barra de desplazamiento visible todo el tiempo pero la desactiva cuando la página no es lo suficientemente larga. Como el ancho de la ventana HTML nunca cambia, el centrado de la página no cambia.

¿Hay alguna solución o forma de diseñar la página para que no salte en Firefox y Safari?

Gracias.

+0

También me ha afectado esto en IE8 y Chrome12. Sin embargo, no estoy seguro de que me guste la solución de barra de desplazamiento permanente. – Cojones

Respuesta

13

Simplemente siempre se puede permitir que la barra de desplazamiento:

html{ 
overflow: scroll; 
} 

pero que le daría la barra de desplazamiento horizontal también, esto es mejor:

html{ 
    overflow-y:scroll; 
    overflow-x:auto; 
} 

Eso le dará sólo el desplazamiento vertical y la horizontal cuando sea necesario.

2

Este sitio contiene un javascript para solucionar el problema, que es una solución mejor OMI que el actual (una barra de desplazamiento permanente):

http://www.johnpezzetti.com/2011/01/31/removing-vertical-scrollbar-jump-shift-problem-a-javascript-fix-for-all-browsers

Este script espera hasta que el DOM se carga entonces comprueba para ver si una barra de desplazamiento está activa. Si lo es, , calcula el ancho de la barra de desplazamiento y establece el margen del cuerpo Izquierda igual a ese ancho. Esto compensa el cambio, y dado que se ejecuta en carga DOM, tiene un efecto instantáneo.

Cuestiones relacionadas