Как сделать отступы элементам в JavaScript

Nik

08.11.2019

544

Доброго дня Александр!, проблема такая — вывел два slick-slaidera на странице, один для отображения последних новостей, другой для отображения отзывов на сайте. Все работает отлично, кроме того что слайдер отзывов с отступами margin по бокам, сжимает слайдер новостей и соответственно новости по виду получаются чуть сжатые. Если отступы убрать, тогда слайды отзывов слипаются. Понимаю что стили одинаковые. Прописал в скрипт такой код — $('.slick-slide').css({
«margin-left»: "+=10",
«margin-right»:"+=10"
});
Все стало хорошо, но, когда уменьшаешь размер экрана и потом возвращаешь, слайды отзывов «слипаются». После перезагрузки страницы все опять нормально.
На фото показал,

b.radikal.ru/b13/1911/60/d4f3fe0aabf9.jpg
В чем может быть причина? Может я неправильно стили в скрипте прописываю?

Если статья понравилась, то поделитесь ей в социальных сетях:

Комментарии ()

Nik

08 ноября 2019, 15:21

А зачем стили добавлять с помощью JavaScript?
Вот и я подумал зачем. Все, проблему решил. С помощью css.
Александр Мальцев

08 ноября 2019, 14:40

Без примера в песочнице не знаю что подсказать. А зачем стили добавлять с помощью JavaScript?

Nik

08 ноября 2019, 14:15

Полный код скрипта, в который добавил

<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>

В конце я добавил отступы

Войдите, пожайлуста, в аккаунт, чтобы оставить комментарий.