Zoom HTML/CSS

Question

Tiene algunas dificultades para ampliar los elementos HTML. En FF o Chrome, echar un vistazo a (muy, muy simple código, pequeño):

http://jsfiddle.net/92wHQ/4/

En el menú desplegable, seleccione 150%. La caja de degradado en blanco y negro se escalará al 150% de su tamaño de origen. Ahora que está escalado, observe que aparece la barra de desplazamiento horizontal y la barra de desplazamiento vertical se expande para acomodar la nueva altura y ancho, más grandes y más grandes.

Ahora cambie de 150% a 50%. La caja de degradado sí escala al 50%, pero observe que la barra de desplazamiento (vertical) no se contrae para acomodar la altura nueva, más pequeña y escalada. En cambio, hay un montón de espacio en blanco vacío debajo del cuadro de degradado.

¿Por qué los navegadores actualizan las barras de desplazamiento para escalar más del 100%, pero no menos del 100%? ¿Cómo puedo obtener el mismo comportamiento para menos del 100% como lo hago con más del 100%? No quiero este espacio en blanco

Answer 1

que tienen una idea de lo que está sucediendo:

La escala afecta a sólo el cuadro de degradado, pero no el div contenedor que se encuentra dentro. Entonces, cuando escala la caja al 150%, el cuadro ahora es comparativamente más grande que el tamaño del contenedor div que está dentro (el contenedor div siempre es 496x250), por lo que coloca barras de desplazamiento.

Por otro lado, cuando lo haces más pequeño, entonces el cuadro de degradado es más pequeño que el contenedor div dentro, por lo que no hay necesidad de barras de desplazamiento.

Puede haber algunas maneras diferentes de manejar esto. El problema principal es que no está manejando el cambio de tamaño/escala del contenedor div.

Answer 2

algo modificado en el violín. Por favor, compruebe si esto es lo que deseo:

http://jsfiddle.net/92wHQ/7/

continuación, las barras de desplazamiento se basa realmente en las dimensiones de 100% y mayores. observe cómo el 100% de la barra de desplazamiento y el 50% de la barra de desplazamiento tienen el mismo "tamaño" mientras que el 150% es el único momento en que se vuelve más pequeño.