Курсор не нацеливается на элементы при прокрутке с помощью колесика мыши / сенсорной панели в Safari
Примеры:
Сравните поток твитов на https://twitter.com/ в Chrome и Safari. Когда мышь удерживается в неподвижном состоянии и подача прокручивается с помощью трекпада или колесика мыши, состояния при наведении не запускаются. Кажется, что курсор нацелен на элементы в Safari только при перемещении курсора, а не при прокрутке окна браузера. Это справедливо как для CSS, так и для JQuery.
Ex.fm удалось решить эту проблему. Если вы прокрутите окно браузера с помощью стационарного курсора над списком песен, состояние наведения будет активировано. Должен быть какой-то способ взломать эту специфическую проблему Safari.
3 ответа
Это исправлено в последних версиях "Webkit Nightly". Это почти наверняка будет в следующей основной версии Safari.
Safari не определяет положение мыши (и, следовательно, вызывает состояние наведения) при прокрутке с помощью трекпада или колеса прокрутки, если только объект, с которым вы взаимодействуете, не находится внутри прокручиваемого объекта. div, Вы можете вложить весь поток контента внутри div установлен в overflow:scroll; чтобы обеспечить динамическое нацеливание на прокрутку. Затем * установите свой div заполнить весь экран, и вы даете ** вид прокрутки страницы, в то время как на самом деле только прокрутка в этом div,
Проверьте этот пример JSFiddle: http://jsfiddle.net/8Nkpr/26/
И этот пример от Грэма Хикса: http://jsfiddle.net/U7SGh/
-
* Очевидно, что это становится проблемой, если вы выполняете какие-либо анимации или взаимодействия, которые основаны на использовании JQuery для определения положения прокрутки. Извините, ребята, без параллакса с этим трюком.
** Вот как ex.fm (как уже упоминалось в оригинальном вопросе) решает это.
*** Спасибо Грэму Хиксу (@gmh) за то, что он указал нам правильное направление.
Ответы на этот вопрос могут дать вам подсказку о том, как поступить. Что происходит в Firefox?
Safari iphone / ipad "зависание мыши" на новой ссылке после замены предыдущей ссылки на javascript