Содержание:
Как сделать отступы элементам в JavaScript
Доброго дня Александр!, проблема такая — вывел два slick-slaidera на странице, один для отображения последних новостей, другой для отображения отзывов на сайте. Все работает отлично, кроме того что слайдер отзывов с отступами margin по бокам, сжимает слайдер новостей и соответственно новости по виду получаются чуть сжатые. Если отступы убрать, тогда слайды отзывов слипаются. Понимаю что стили одинаковые. Прописал в скрипт такой код — $('.slick-slide').css({
«margin-left»: "+=10",
«margin-right»:"+=10"
});
Все стало хорошо, но, когда уменьшаешь размер экрана и потом возвращаешь, слайды отзывов «слипаются». После перезагрузки страницы все опять нормально.
На фото показал,
b.radikal.ru/b13/1911/60/d4f3fe0aabf9.jpg
В чем может быть причина? Может я неправильно стили в скрипте прописываю?
«margin-left»: "+=10",
«margin-right»:"+=10"
});
Все стало хорошо, но, когда уменьшаешь размер экрана и потом возвращаешь, слайды отзывов «слипаются». После перезагрузки страницы все опять нормально.
На фото показал,
b.radikal.ru/b13/1911/60/d4f3fe0aabf9.jpg
В чем может быть причина? Может я неправильно стили в скрипте прописываю?
Nik
2019-11-08 14:15:11
Полный код скрипта, в который добавил
<script>
$('.direction-blocks').slick({
arrows: false,
dots: true,
dotsClass: "my-dots",
infinite: true,
speed: 800,
slidesToShow: 3,
slidesToScroll: 1,
autoplay: true,
autoplaySpeed: 8000,
responsive: [
{
breakpoint: 1024,
settings: {
slidesToShow: 3,
slidesToScroll: 3,
infinite: true,
dots: true
}
},
{
breakpoint: 600,
settings: {
slidesToShow: 2,
slidesToScroll: 2
}
},
{
breakpoint: 480,
settings: {
slidesToShow: 1,
slidesToScroll: 1
}
}
// You can unslick at a given breakpoint now by adding:
// settings: "unslick"
// instead of a settings object
]
});
$('.slick-slide').css({
"margin-left": "+=10",
"margin-right":"+=10"
});
</script>В конце я добавил отступы
Комментарии: 3