Pregunta sobre Slide Anything - Responsive Content / HTML Slider and Carousel de Wordpress:

La altura de deslizamiento mínima no funciona

Un usuario preguntó 👇

Cuando cambia a un tamaño de pantalla más pequeño, la altura mínima cambia a un número menor de diapositivas antes de que cambie el número de diapositivas. A medida que disminuye el ancho de la ventana, la altura mínima de las diapositivas debe reducirse para mantener la relación de aspecto de las diapositivas. Por lo general, lo hace, pero hay un punto en el que este comportamiento se rompe. Por ejemplo, vaya a https://edgewebpages.com/slide-anything-usage-examples/ y establezca el ancho de la ventana en 997px. (Estoy usando Google Chrome con las herramientas de desarrollador abiertas para ver el ancho de la ventana) La altura mínima de los divs con la clase «sa_hover_container» es 392px. Cambie el ancho de la ventana a 996px, y los divs de altura mínima suben a 588px en lugar de bajar, haciendo que la relación de aspecto de las imágenes sea mucho más alta de lo que deberían ser. La altura de dos diapositivas es de 588px, pero todavía se ven tres diapositivas. La presentación de diapositivas no cambia a dos diapositivas hasta que el ancho de la ventana cae a 979px. En este punto, la relación de aspecto de las diapositivas vuelve a la normalidad. Entonces, cuando el ancho de la ventana está en el rango de 980px a 996px, la relación de aspecto de los controles deslizantes es demasiado alta.

Gracias por cualquier ayuda, Steve

(@simonpedge)

Hace 9 meses, 4 semanas

Hola Steve, Eso es todo para mí para señalar este error. Mirando el código, todo está bien:

function sa_resize_menu_slider() {
	var min_height = '120';
	var win_width = jQuery(window).width();
	var slider_width = jQuery('#menu_slider').width();
	if (win_width < 480) {
		var slide_width = slider_width / 1;
	} else if (win_width < 768) {
		var slide_width = slider_width / 2;
	} else if (win_width < 980) {
		var slide_width = slider_width / 2;
	} else if (win_width < 1200) {
		var slide_width = slider_width / 3;
	} else if (win_width < 1500) {
		var slide_width = slider_width / 3;
	} else {
		var slide_width = slider_width / 3;
	}
	slide_width = Math.round(slide_width);
	...

Creo que el problema podría estar en la función jQuery incorporada utilizada:
var win_width = jQuery (ventana) .width ();
Y barra de desplazamiento: el rango del que está hablando es de 16 píxeles y ese es probablemente el ancho de la barra de desplazamiento de la página.

Si abre las herramientas para desarrolladores de Chrome, haga clic en el navegador móvil, configure el dispositivo en «Responsive» y luego configure manualmente el ancho en 990 px, verá que la altura del control deslizante se ve bien 120%. PERO si normalmente ve la página en la ventana de su navegador y cambia a 990px, verá el problema que ha resaltado.

Así que creo que en el mundo real, en tabletas funciona bien en este rango de resolución de 980-996, solo porque estamos probando este rango en un navegador de escritorio (con barra de desplazamiento) y se está desechando.

¿Solucionó tu problema??

0 / 0

Deja una respuesta 0

Tu dirección de correo electrónico no será publicada. Los campos obligatorios están marcados con *