@Keppler-23b

Почему не работает скрипт JS?

Подскажите пожалуйста, на странице не работает JS скрипт, сам скрипт подключен в head отдельным файлом, но почему-то слайды не создаются, сайт на Неткате
сама страница: https://mc-titan.ru/proekty/
сам скрипт:
(function () {
  var slidersContainer = document.querySelector(".sliders-container");

  // Initializing the numbers slider
  var msNumbers = new MomentumSlider({
    el: slidersContainer,
    cssClass: "ms--numbers",
    range: [1, 4],
    rangeContent: function (i) {
      return "0" + i;
    },
    style: {
      transform: [{ scale: [0.4, 1] }],
      opacity: [0, 1]
    },
    interactive: false
  });

  // Initializing the titles slider
  var titles = [
    "King of the Ring Fight",
    "Sound of Streets",
    "Urban Fashion",
    "Windy Sunset"
  ];
  var msTitles = new MomentumSlider({
    el: slidersContainer,
    cssClass: "ms--titles",
    range: [0, 3],
    rangeContent: function (i) {
      return "<h3>" + titles[i] + "</h3>";
    },
    vertical: true,
    reverse: true,
    style: {
      opacity: [0, 1]
    },
    interactive: false
  });

  // Initializing the links slider
  var msLinks = new MomentumSlider({
    el: slidersContainer,
    cssClass: "ms--links",
    range: [0, 3],
    rangeContent: function () {
      return '<a class="ms-slide__link">View Case</a>';
    },
    vertical: true,
    interactive: false
  });

  // Get pagination items
  var pagination = document.querySelector(".pagination");
  var paginationItems = [].slice.call(pagination.children);

  // Initializing the images slider
  var msImages = new MomentumSlider({
    // Element to append the slider
    el: slidersContainer,
    // CSS class to reference the slider
    cssClass: "ms--images",
    // Generate the 4 slides required
    range: [0, 3],
    rangeContent: function () {
      return '<div class="ms-slide__image-container"><div class="ms-slide__image"></div></div>';
    },
    // Syncronize the other sliders
    sync: [msNumbers, msTitles, msLinks],
    // Styles to interpolate as we move the slider
    style: {
      ".ms-slide__image": {
        transform: [{ scale: [1.5, 1] }]
      }
    },
    // Update pagination if slider change
    change: function (newIndex, oldIndex) {
      if (typeof oldIndex !== "undefined") {
        paginationItems[oldIndex].classList.remove("pagination__item--active");
      }
      paginationItems[newIndex].classList.add("pagination__item--active");
    }
  });

  // Select corresponding slider item when a pagination button is clicked
  pagination.addEventListener("click", function (e) {
    if (e.target.matches(".pagination__button")) {
      var index = paginationItems.indexOf(e.target.parentNode);
      msImages.select(index);
    }
  });
})();
  • Вопрос задан
  • 126 просмотров
Пригласить эксперта
Ответы на вопрос 1
Raxen
@Raxen
TechLead Frontend Developer, Beeline
Перенесите подключние скрипта из head в body, если скрипт использует jquery, то после jquery
Ответ написан
Ваш ответ на вопрос

Войдите, чтобы написать ответ

Похожие вопросы