Задать вопрос
@alexiusgrey

Как объединить draggable с анимацией бегущей строчки?

Сначала на сайте одно из меню должно было быть бегущей строчкой с паузой при наведении.
Выглядело это приблизительно вот так
Для чего сбоку настройки слик, которые не действуют - через 2 абзаца ниже.

Но клиенты хотят чтобы строчка еще и таскалась, как draggable в slick slider, и на мобильных девайсах на таче оно в виде первой анимации не останавливалось.

Я решил сделать сликом, на кодпене оно должно было быть с ним.,но там что-то не подключается jQuery
at t (https://cdnjs.cloudflare.com/ajax/libs/jquery/3.7.1/jquery.min.js:2:27330)" undefined

Когда я выбираю подключить jQuery - что через настройки на кодпене, что ссылкой вот такое сообщение.

Как сейчас - вот на самом сайте
А сами настройки слика на кодпене, хоть они там и не действуют.
Да и slidesToShow там по сути для галочки, нужные стили все-таки берут верх, можно не обращать внимание на этот показатель, я не буду его исправлять, пусть так и будет.

Оно сейчас на сайте таскается, но анимация на аутоплее нам с клиентами не очень нравится. Первая была плавная, а на слике аутоплей дергается. Хотелось бы старую анимацию бегущей строчки как на кодпене, но чтобы таскалось как на слике.
Я закомментировал свойства сейчас на сайте

.track {
    /* position: absolute!important;
    animation: marquee 45s linear infinite;  */
}

.track:hover{
	-moz-animation-play-state: paused;
	-webkit-animation-play-state: paused;
	animation-play-state: paused;	
}

Потому что если раскомментировать, то работает не корректно.
Пробовал сделать так, чтобы animation: marquee 45s linear infinite была не закомментирована, но на ховере чтобы
.track:hover{
	animation: unset;	
}

Тоже не то, что надо - оно останавливается и резко становится на начальную точку, а не на ту, на которую навели на паузе.
Как можно чтобы были свойства слика, но с первоначальной анимацией бегущей строчки?
  • Вопрос задан
  • 59 просмотров
Подписаться 1 Средний Комментировать
Пригласить эксперта
Ваш ответ на вопрос

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

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