/* ========================================================= PARCHE MÓVIL MUY SIMPLE · AS SLIDER NO modifica la lógica original de los textos ========================================================= */ @media (max-width: 767px){ /* Slider */ .as-slider .as-side-slider, .as-slider .as-side-slider .elementor-swiper, .as-slider .as-side-slider .swiper, .as-slider .as-side-slider .swiper-container{ width: 100% !important; max-width: 100% !important; min-width: 0 !important; } /* ===================================================== TEXTO CAMBIANTE IMPORTANTE: NO cambiamos currentUp/currentDown. Lo sigue haciendo tu código original. ===================================================== */ .as-slider .as-changing-widget{ min-width: 0 !important; overflow: visible !important; /* * Evitamos que en móvil el contenedor * quede colapsado. */ min-height: var(--h, 1px); } /* * Garantizamos que el elemento que tu código * original considera activo pueda verse. */ .as-slider .as-changing-widget .elementor-widget.currentUp, .as-slider .as-changing-widget .elementor-widget.currentDown{ opacity: 1 !important; visibility: visible !important; } } (function($){ "use strict"; const MOBILE_MAX = 767; let resizeTimer = null; /* ========================================================= SABER SI ESTAMOS EN MÓVIL ========================================================= */ function isMobile(){ return window.innerWidth <= MOBILE_MAX; } /* ========================================================= ENCONTRAR SWIPER ========================================================= */ function getSwiper($slider){ let swiper = null; $slider .find( '.as-side-slider .swiper,' + '.as-side-slider .swiper-container,' + '.as-side-slider .elementor-swiper' ) .each(function(){ if(this.swiper){ swiper = this.swiper; return false; } }); return swiper; } /* ========================================================= FORZAR 2 FOTOS EN MÓVIL ========================================================= */ function setTwoSlides($slider){ if(!isMobile()){ return; } const swiper = getSwiper($slider); if(!swiper){ return; } /* * SOLO modificamos Swiper. * * No tocamos currentUp, * currentDown, * prev, * next, * etc. */ swiper.params.slidesPerView = 2; swiper.params.slidesPerGroup = 1; swiper.params.spaceBetween = 16; swiper.params.centeredSlides = false; /* * Elementor puede volver a consultar * estos parámetros durante resize. */ if(swiper.originalParams){ swiper.originalParams.slidesPerView = 2; swiper.originalParams.slidesPerGroup = 1; swiper.originalParams.spaceBetween = 16; swiper.originalParams.centeredSlides = false; } try{ swiper.updateSize(); swiper.updateSlides(); swiper.updateProgress(); swiper.updateSlidesClasses(); swiper.update(); } catch(e){} } /* ========================================================= RECALCULAR ALTURA DE NOMBRE / CARGO / TEXTOS ========================================================= */ function updateTextHeights($slider){ if(!isMobile()){ return; } $slider .find('.as-changing-widget') .each(function(){ const $container = $(this); /* * AQUÍ respetamos exactamente * las clases que crea tu código original. */ const $active = $container.find( '.elementor-widget.currentUp,' + '.elementor-widget.currentDown' ).first(); if(!$active.length){ return; } /* * No modificamos clases. * Solo medimos. */ requestAnimationFrame( function(){ requestAnimationFrame( function(){ let height = $active.outerHeight(true); if( (!height || height 0 ){ const finalHeight = Math.ceil(height); $container.css( '--h', finalHeight + 'px' ); /* * Refuerzo para móvil. */ $container.css( 'min-height', finalHeight + 'px' ); } } ); } ); }); } /* ========================================================= ACTUALIZAR UN SLIDER ========================================================= */ function refreshSlider($slider){ setTwoSlides( $slider ); /* * Primero dejamos actuar al código original. * * Él establece currentUp/currentDown. * * Después medimos la altura. */ setTimeout( function(){ updateTextHeights( $slider ); }, 50 ); setTimeout( function(){ updateTextHeights( $slider ); }, 550 ); } /* ========================================================= TODOS LOS SLIDERS ========================================================= */ function refreshAll(){ $('.as-slider') .each(function(){ refreshSlider( $(this) ); }); } /* ========================================================= ESPERAR A QUE SWIPER EXISTA ========================================================= */ function start(){ let attempts = 0; const wait = setInterval( function(){ attempts++; let allReady = true; $('.as-slider') .each(function(){ if( !getSwiper( $(this) ) ){ allReady = false; } }); /* * Aunque no estén todos preparados, * vamos corrigiendo los que sí. */ refreshAll(); if( allReady || attempts >= 100 ){ clearInterval( wait ); } }, 50 ); } /* ========================================================= LOAD ========================================================= */ $(window).on( 'load', function(){ start(); setTimeout( refreshAll, 800 ); setTimeout( refreshAll, 1500 ); } ); /* ========================================================= RESIZE ========================================================= */ $(window).on( 'resize', function(){ clearTimeout( resizeTimer ); resizeTimer = setTimeout( refreshAll, 250 ); } ); /* ========================================================= ORIENTATION CHANGE ========================================================= */ window.addEventListener( 'orientationchange', function(){ setTimeout( refreshAll, 500 ); } ); /* ========================================================= DETECTAR CAMBIO DE SLIDE No sustituimos el código original. Simplemente esperamos a que él haga su trabajo y después recalculamos la altura. ========================================================= */ $(document).on( 'click', '.as-slider .as-slider-left,' + '.as-slider .as-slider-right,' + '.as-slider .as-bar .dot,' + '.as-slider .swiper-pagination-bullet', function(){ const $slider = $(this).closest( '.as-slider' ); setTimeout( function(){ updateTextHeights( $slider ); }, 550 ); } ); })(jQuery);