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

Nik
Nik
2.3K
3
Доброго дня Александр!, проблема такая - вывел два slick-slaidera на странице, один для отображения последних новостей, другой для отображения отзывов на сайте. Все работает отлично, кроме того что слайдер отзывов с отступами margin по бокам, сжимает слайдер новостей и соответственно новости по виду получаются чуть сжатые. Если отступы убрать, тогда слайды отзывов слипаются. Понимаю что стили одинаковые. Прописал в скрипт такой код - $('.slick-slide').css({ "margin-left": "+=10", "margin-right":"+=10" }); Все стало хорошо, но, когда уменьшаешь размер экрана и потом возвращаешь, слайды отзывов "слипаются". После перезагрузки страницы все опять нормально. На фото показал, https://b.radikal.ru/b13/1911/60/d4f3fe0aabf9.jpg В чем может быть причина? Может я неправильно стили в скрипте прописываю?

Комментарии: 3

  1. Nik
    Nik
    08.11.2019, 15:21
    А зачем стили добавлять с помощью JavaScript?
    Вот и я подумал зачем. Все, проблему решил. С помощью css.
  2. Александр Мальцев
    Александр Мальцев
    08.11.2019, 14:40
    Без примера в песочнице не знаю что подсказать. А зачем стили добавлять с помощью JavaScript?
  3. Nik
    Nik
    08.11.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>
    В конце я добавил отступы