Página 1 de 1

Como fazer o banner apresentar 3 imagens ao mesmo tempo?

Enviado: 17 Fev 2022, 12:05
por Mateus Pizzolo
Olá. Estou precisando fazer o banner apresentar mais de uma imagem ao mesmo tempo, porém, quando altero o código, as imagens ficam cortadas. Mas, quando é informado para apresentar somente uma imagem, ele funciona perfeitamente.

Com 3 imagens
Imagem

Com 1 Imagem
Imagem

Acontece quando é alterado dentro do Slider.twig o campo "slidesPerView"
Código: Selecionar todos
<script type="text/javascript"><!--
$('#slideshow{{ module }}').swiper({
	mode: 'horizontal',
	slidesPerView: 1,
	pagination: '.slideshow{{ module }}',
	paginationClickable: true,
	nextButton: '.slideshow .swiper-button-next',
    prevButton: '.slideshow .swiper-button-prev',
    spaceBetween: 10,
    autoplayDisableOnInteraction: true,
	loop: true
});
//--></script>

Re: Como fazer o banner apresentar 3 imagens ao mesmo tempo?

Enviado: 21 Fev 2022, 21:29
por reds
Ola @Mateus Pizzolo

Qual seria as medidas de cada imagem que esta colocando ai no seu exemplo?
Vide que deveria sim reproduzir normal, inclusive simulei aqui um teste e correi perfeitamente.
;)

Re: Como fazer o banner apresentar 3 imagens ao mesmo tempo?

Enviado: 23 Fev 2022, 13:55
por Mateus Pizzolo
reds escreveu:Ola @Mateus Pizzolo

Qual seria as medidas de cada imagem que esta colocando ai no seu exemplo?
Vide que deveria sim reproduzir normal, inclusive simulei aqui um teste e correi perfeitamente.
;)
reds escreveu:Ola @Mateus Pizzolo

Qual seria as medidas de cada imagem que esta colocando ai no seu exemplo?
Vide que deveria sim reproduzir normal, inclusive simulei aqui um teste e correi perfeitamente.
;)

Olá. O tamanho das imagens são setados no Menu admin:

Re: Como fazer o banner apresentar 3 imagens ao mesmo tempo?

Enviado: 23 Fev 2022, 14:50
por reds
ola @Mateus Pizzolo
Em exemplo eu utilizei imagens com dimensões diferentes a fim de testar o esquema, e então tudo correu bem pra mim.
No print em anexo visto que tudo esta ok com o o slide com 3 imagens na linha.
No exemplo anexado foi usado 3 imagens com dimensões 448px X 260px cada

Esse é o script
Código: Selecionar todos
  $('#slideshow{{ module }}').swiper({
    mode: 'horizontal',
    slidesPerView: 3,
    pagination: '.slideshow{{ module }}',
    paginationClickable: true,
    nextButton: '.slideshow .swiper-button-next',
    prevButton: '.slideshow .swiper-button-prev',
    spaceBetween: 10,
    autoplay: $('#slideshow{{ module }} img').length > 1 ? 2500 : 0,
    autoplayDisableOnInteraction: true,
    loop: true
  });

Re: Como fazer o banner apresentar 3 imagens ao mesmo tempo?

Enviado: 24 Fev 2022, 12:26
por Mateus Pizzolo
Consegui ajustar setando as imagens como um tamanho padrão no bdd. Removi a opção de setar o tamanho da imagem no Módulo.

Obrigado pela atenção