Empresas
Empregos
  • Sobre nós
  • Soluções
    • Publicação de vagas
      Publique sua vaga e receba candidatos qualificados em 48h.
    • Avaliações de candidatos
      Mais de 500 testes técnicos e psicológicos, mais anti-fraude.
    • Headhunting
      Busca executiva personalizada do início ao fim.
    • Folha de Pagamento + EOR
      Dispersão de folha e EOR em mais de 15 países da LATAM.
  • Preços
  • Empregos

0

477
Visualizações
Swiper: Set custom slide to active

I'm using Swiper to show a slider with every month of the year. It slides from left to right.

I now want to start with the current month on the left side. If there are month before, they should be in the left offset.

I tried to give the .swiper-slide class the active class .swiper-slide-active:

<div class="swiper-slide swiper-slide-active">

But that doesnt work.

In the docs I found no parameter to set a acive slide in the settings. Is there any way to do this?

Here's my current code: 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,
    },
});

The activeIndex: 6 doesn't work either. I'm not sure if that's correct.

about 4 years ago · Juan Pablo Isaza
1 Respostas
Responde à pergunta

0

Try initialSlide, activeIndex is just for getting the actual active index. But I think you shoud use 5 insted of 6 to start on sixth month, because first month starts with 1 and indexing starts from 0.

var swiper = new Swiper(".swiper-months", {
    initialSlide: 6,
    cssMode: false,
    slidesPerView: 3.5,
    spaceBetween: 16,
    mousewheel: {
        forceToAxis: true,
    },
});
about 4 years ago · Juan Pablo Isaza Relatório
Responde à pergunta
Encontrar trabalhos remotos

Descubra a nova forma de encontrar um emprego!

melhores empregos
Principais categorias de trabalho
Empresas
Postar vaga Preços Comercial
Jurídico
Termos e Condições Política de privacidade
© 2026 PeakU Inc. All Rights Reserved.
Andres GPT
Recomende algumas ofertas para mim
Preciso de ajuda