Estoy usando Swiper para mostrar un control deslizante con cada mes del año. Se desliza de izquierda a derecha.
Ahora quiero comenzar con el mes actual en el lado izquierdo. Si hay un mes antes, deben estar en el desplazamiento izquierdo.
Traté de darle a la clase .swiper-slide la clase activa .swiper-slide-active :
<div class="swiper-slide swiper-slide-active">Pero eso no funciona.
En los documentos no encontré ningún parámetro para establecer una diapositiva activa en la configuración. ¿Hay alguna manera de hacer esto?
Aquí está mi código actual: https://codepen.io/cray_code/pen/dydrLBP
var swiper = new Swiper(".swiper-months", { cssMode: false, slidesPerView: 3.5, spaceBetween: 16, activeIndex: 6, mousewheel: { forceToAxis: true, }, }); El activeIndex: 6 tampoco funciona. No estoy seguro si eso es correcto.
Pruebe initialSlide , activeIndex es solo para obtener el índice activo real. Pero creo que debería usar 5 en lugar de 6 para comenzar el sexto mes, porque el primer mes comienza con 1 y la indexación comienza con 0.
var swiper = new Swiper(".swiper-months", { initialSlide: 6, cssMode: false, slidesPerView: 3.5, spaceBetween: 16, mousewheel: { forceToAxis: true, }, });