Как сделать, чтоб при скроллинге в определенном разрешении экрана ховер убирался?

Добрый день!
Есть такое решение:
https://jsfiddle.net/nlynx/v5vfdwh3/2/

если изменять поле с результатом от 700px и ниже, то скрытый текст при ховере перестанет показываться. Это, конечно, хорошо, но есть ли варианты, чтобы скрытый текст все-таки показывался при наведении курсора и в данном диапазоне тоже, но как только страницу станут скроллить, он сразу исчезал.

Заранее спасибо за помощь!
  • Вопрос задан
  • 290 просмотров
Пригласить эксперта
Ответы на вопрос 2
lazalu68
@lazalu68
Salmon
1. Хардкодить тексты в JS - приемлемо только в целях демонстрации, во всех остальных случаях вам будет категорически неудобно пользоваться такой системой,
2. У вас просто в CSS есть правило, которое скрывает их при ширине ниже 700, достаточно его убрать,
3. Как один из вариантов можно просто при скролле вешать на общий для нужных элементов класс, который будет скрывать эти элементы,
Ответ написан
therealmoronto
@therealmoronto
Middle full stack developer :)
1. Повесить на нужные элементы класс.
2. В jQuery есть замечательная функция .scroll(). Как аргумент, передать этой функции handler для обработки события: в твоем случае, заставить исчезнуть нужный элемент и убрать ему псевдокласс :hover.
3. Насладиться результатом.
P.S.: Вот тут есть пример - https://api.jquery.com/scroll/#entry-examples
Ответ написан
Комментировать
Ваш ответ на вопрос

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

Войти через центр авторизации
Похожие вопросы
19 апр. 2024, в 03:52
1000 руб./за проект
19 апр. 2024, в 03:01
1000 руб./за проект
18 апр. 2024, в 21:56
2000 руб./за проект