Hola a todos.
Se trata de un slider que quiero que ocupe el 100% de la resolución de la pantalla.
Aparentemente fácil, y con muchas soluciones en el mercado, pero no tanto, porque el alto debe ser siempre el mismo: 500 píxeles. El problema es que debe mostrarse y verse el centro de la imagen.
La imagen es de 2560 píxeles de ancho.
Si la vemos en un monitor de esa resolución, se ve bien.
Si le adjundicamos un 100% de ancho, se ve bien en tal resolución, pero a medida que el tamaño de la pantalla se estrecha, se produce un fenómeno de decrecimiento proporcional del alto de la imagen, puesto que al disminuir el ancho, el alto también decrece y ya no es 500 px.
Si no le pones el 100% y dejas que se muestre tal cual, el centro se va desplazando hacia la derecha a medida que el monitor es menor, hasta desaparecer, como es lógico.
Lo ideal sería que se mostrase siempre centrado y que, en el caso de monitores de pequeña resolución, sólo se mostrase el centro de la imagen, con el resto de píxeles a derecha e izquierda ocultos como en una suerte de overflow: hidden. y sin scroll claro.
El problema es que no acabo de dar con la solución.
¿Se le ocurre a alguien? Yo no la he visto en ningún sitio, tal vez no exista. He visto algunos sliders que muestran un height fijo en una número de píxeles y luego el width en 100%, pero claro, lo que ocurre es que luego deforma la imagen.
Me gustaría abrir un debate sobre este tema, que creo es interesante.
Un saludo y gracias.
