Tyoma_Ti
@Tyoma_Ti

Как решить проблему с двумя slick-слайдерами на странице?

Друзья, поставил на свой лендинг два разных slick-слайдера. Для каждого из них прописал отдельные свойства и путь к файлам JS и CSS в файле index:

<link rel="stylesheet" href="slick.css">
<link rel="stylesheet" href="slick1.css">
...
<script src="slick.min.js"></script>
<script src="slick1.min.js"></script>

Файлы style.css и common.js общие.
При загрузке страницы ОБА слайдера почему-то используют те данные, которые записаны в slick1. Как я ни пытался добиться того, чтобы они использовали разные свойства, у меня ничего не получается. В чём может быть проблема?
Я новичок в html/css/js, поэтому буду рад любой помощи. Спасибо!
  • Вопрос задан
  • 2143 просмотра
Пригласить эксперта
Ответы на вопрос 2
MrDecoy
@MrDecoy Куратор тега JavaScript
Верставший фронтендер
Вам следует использовать по одному css и js файлу для любого количестве slick-слайдеров на странице.
Если оба слайдера используют одни и те же данные, то тут всего 2 варианта:
1) Вы по ошибке указали один и тот же объект в качестве настроек для обоих слайдеров,
2) Вы инициализировали действительно слайдеры с разными настройками, на одном и том же селекторе.

P.s.Если оба варианта Вам не подходят - приложите js код (можно вместе с html), а то кроме как догадок\предположений ничего не получите.
Ответ написан
Комментировать
@Lord_Dantes
Вы можете подключить 1 CSS и 1 JS файл к вашему html.
Просто при инициализации используйте разные названия каруселей.
<div class="slick1 slick-slider">
<div class="slick2 slick-slider">

И свойства кидайте на вот эти классы slick1, slick2
Ответ написан
Ваш ответ на вопрос

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

Войти через центр авторизации
Похожие вопросы