2011-09-14 11 views
6

Pregunta muy básica, creo. Tengo un sitio web donde es probable que algunas páginas quepan dentro del área vertical visible del navegador, y otras no (muchos sitios deben ser así).Mantener una página web centrada cuando la barra de desplazamiento del navegador aparece y desaparece

Cuando los usuarios navegan de una página a otra en el explorador de escritorio, la barra de desplazamiento vertical aparece y desaparece, dependiendo de la página. El efecto es que la página bien centrada sigue cambiando por el ancho de la barra de desplazamiento cuando el usuario simplemente selecciona otro enlace de navegación: ¿cuál es la forma más fácil de evitar que esto suceda, sin hacer que todas mis páginas web tengan la misma altura?

Segunda parte: ¿por qué el navegador de escritorio no solo reserva el área vertical de la barra de desplazamiento, quizás haya una forma de forzarlos?

+0

votación para migrar a Stackoverflow. Espero que obtengas una respuesta rápidamente allí. –

+0

Posible duplicado de [¿Cómo evito que mi contenido web cambie a la izquierda cuando aparece la barra de desplazamiento vertical? Roll-Up of Advice 2017] (https://stackoverflow.com/questions/45524214/how-do-i-stop-my-web-content-from-shifting-left-when-the-vertical-scrollbar-appe) – JBH

Respuesta

6

Esto no es (no funciona con IE6):

body { overflow-y: scroll; } 

Si también quiere mostrar siempre la barra de desplazamiento horizontal, utilice esto:

body { overflow: scroll; } 
+0

Justo lo que necesitaba – pgfearo

3

En cuanto a su segunda pregunta , no todos los sitios están hechos de páginas centradas de ancho fijo, incluso si se volvió muy común. Incluso en este caso, debe tener páginas de longitudes muy diferentes de clic para hacer clic para molestarse por este cambio (por cierto cambia por medio el ancho de la barra de desplazamiento;) que es 8px en WinXP con un tema clásico de Win2k .

  • Al principio no había páginas HTML sin CSS: alineado a la izquierda (o alineado a la derecha en hebreo y árabe)
  • Luego vino gradualmente tablas HTML en 14" CRT: cada píxel era preciosa (completo! ancho porque 640kB es suficiente pocos imaginaron cómo se mostraría en CRT de 17 "o 21")
  • Luego vinieron tablas o divs centrados de ancho fijo: los píxeles seguían siendo preciosos en pantallas de 1024px. Con alturas < 768px, la mayoría las páginas tenían un doblez (o se hicieron con Flash).
  • Ahora viene CSS3 Media Queries, displays with anchos de 320 a 2560 px (por monitor), mejora progresiva o degradación elegante.
  • Las páginas como la página de inicio de Google o las aplicaciones web son comunes: ¡no hace falta una barra de desplazamiento vertical!

Buena suerte con que para establecer una regla si usted es un vendedor del navegador, especialmente teniendo en cuenta la reciente desaparición de menús, barras, etc en Chrome y Firefox a continuación, y tal vez otros navegadores que pueden indicar que los vendedores están persiguiendo una objetivo de pantalla completa (simplemente presiono F11 si quiero y quiero que mi barra de direcciones vuelva, pero esa es otra historia :)) y que probablemente se mostrarán reacios a "perder" 20px horizontalmente.

Como nota al margen, tal vez usted como desarrollador de este sitio es el más molesto por este cambio horizontal porque tiene su sitio expuesto todo el día frente a sus ojos y está acostumbrado a hacer clic precisamente en esto y aquello áreas sin siquiera pensarlo más: ¡usted conoce su sitio como nadie más!
Este no será el caso de sus visitantes, solo algunos lo verán más de dos veces y usted tendrá que ser fluido para saber de dónde viene este fenómeno, de lo contrario es una molestia menor como en algunos otros sitios. ellos vistaron.Y que ha de tener en cuenta lo que podría ser más molesto para los visitantes:

  • que muestra una barra de desplazamiento que indica a primera vista que deben desplazarse (antes de que ven en la segunda visión que esta barra de desplazamiento vertical se desactiva lo que en realidad no hay desplazamiento)
  • un desplazamiento horizontal 10px de vez en cuando
+0

+1 Para una respuesta informativa, solo agregaría que los navegadores web basados ​​en el tacto no usan una barra de desplazamiento (solo un indicador de desplazamiento flotante), por lo tanto, las expectativas de los usuarios cambiarán a un sitio web sin fluctuaciones. navegación, incluso cuando cambian a navegadores basados ​​en mouse/teclado. – pgfearo

Cuestiones relacionadas