Minha dúvida vem em relação a carrosséis para listagem de produtos, onde ao invés de um único elemento, possui mais de um e além de tudo são responsivos, como no print abaixo:
Solucionado
Minha dúvida vem em relação a carrosséis para listagem de produtos, onde ao invés de um único elemento, possui mais de um e além de tudo são responsivos, como no print abaixo:
Olá, Rogerio! Tudo bem?
Pelo que entendi, você está com dúvidas em relação a como criar um carrossel responsivo para listagem de produtos, certo? Uma opção interessante para isso é utilizar o plugin Owl Carousel 2, que você mencionou na imagem.
Para criar um carrossel com mais de um elemento, basta definir a propriedade "items" com o número de itens que você deseja exibir por vez. Por exemplo, se você quiser exibir 3 produtos por vez, basta definir "items: 3" nas opções do plugin.
Além disso, para tornar o carrossel responsivo, é importante definir as opções "responsive" do plugin, que permitem definir quantos itens serão exibidos em diferentes tamanhos de tela. Por exemplo, você pode definir que em telas menores serão exibidos apenas 1 ou 2 itens por vez.
Aqui está um exemplo de código que pode ajudar a criar um carrossel responsivo com o plugin Owl Carousel 2:
$('.owl-carousel').owlCarousel({
items: 3,
loop: true,
margin: 10,
responsive:{
0:{
items:1
},
600:{
items:2
},
1000:{
items:3
}
}
});Espero ter ajudado e bons estudos!