Opa Felipe,
Desculpa se não fui claro na pergunta. A ideia era fazer com que mais slides fossem aparecendo conforme eu redimensionasse a página. Por exemplo, mobile aparece 1 slide, tablet aparece 2, etc.
Encontrei uma maneira de fazer isso pelo JS, meio que criando media queries com os if/else if.
window.onload = function init() {
let mobile = window.matchMedia("(max-width: 767px)"); //1
let miniTablet = window.matchMedia("(max-width: 853px)"); //2
let bigTablet = window.matchMedia("(max-width: 1023px)"); //3
let desktop = window.matchMedia("(max-width: 1999px)"); //4
// let widescreen = window.matchMedia("(min-width: 2560px)"); //6
if (mobile.matches) {
$(document).ready(function () {
$('.slider').slick({
infinite: true,
slidesToShow: 1
});
});
} else if (miniTablet.matches) {
$(document).ready(function () {
$('.slider').slick({
infinite: true,
slidesToShow: 2
});
});
} else if (bigTablet.matches) {
$(document).ready(function () {
$('.slider').slick({
infinite: true,
slidesToShow: 3
});
});
} else if (desktop.matches) {
$(document).ready(function () {
$('.slider').slick({
infinite: true,
slidesToShow: 4
});
});
} else {
$(document).ready(function () {
$('.slider').slick({
infinite: true,
slidesToShow: 5
});
});
}
};
Isso resolveu meu problema por enquanto. Obrigado pela ajuda! :D
