Есть ли способ «сбросить» псевдо-зависание мобильного Webkit после первого клика, вызывающего зависание? - PullRequest
5 голосов
/ 25 ноября 2010

Я работаю на веб-сайте, где я использую Javascript (через JQuery), чтобы добавить всплывающие окна, содержащие дополнительную информацию для элементов в списке. Я использую события JQuery mouseeneter и mouseleave, чтобы всплывающие окна появлялись и исчезали, что, конечно, прекрасно работает в настольных браузерах.

В Mobile Safari всплывающее окно появляется, когда я щелкаю элемент (что я и ожидаю), и я добавляю ontouchstart, который вызывает событие mouseleave JQuery, таким образом скрывая все видимые всплывающие окна. когда пользователь делает что-нибудь еще. Это тоже хорошо работает, за исключением того, что когда пользователь нажимает на элемент, всплывающее окно которого он только что просмотрел и отменил (путем прокрутки или выполнения чего-либо еще, что вызывает событие ontouchstart), вместо того, чтобы показывать всплывающее окно снова активирует ссылку, прикрепленную к этому элементу.

Если бы пользователь нажал на другой элемент вместо того, чтобы снова нажать на тот же самый элемент, то всплыло бы всплывающее окно этого нового элемента, а затем, если бы ему снова пришлось нажать на первый элемент, всплыло бы это элемент. Опять же, это ожидаемое и то, чего я хочу.

Может показаться, что после того, как элемент с событием наведения был нажат, и Mobile Safari был вынужден выполнить это событие, этот элемент затем помечается как вызвавший событие наведения, и поэтому следующее нажатие не имеет чтобы притвориться парящим, это может быть обычный щелчок. Нажатие другого элемента с событием зависания, похоже, «сбрасывает» флаг, установленный для предыдущего элемента.

Я бы хотел иметь возможность «сбросить» этот флаг для себя так, чтобы вместо того, как в данный момент все работало, при нажатии на элемент отображалось всплывающее окно и следующий щелчок по этому элементу, даже если всплывающее окно был закрыт, активирует ссылку, вместо этого, когда я закрываю всплывающее окно с моим ontouchstart, и, таким образом, по моему мнению, элемент больше не «зависает», второй щелчок по тому же элементу должен показать всплывающее окно снова и только тогда, нажав на элемент, пока всплывающее окно видно, если ссылка активируется.

Секрет, по-видимому, заключается в том, чтобы заставить Mobile Safari выйти из режима "псевдо-наведения", когда я использую ontouchstart для запуска mouseleave, но мне не удалось найти что-нибудь полезное где-то точно, что происходит, когда Mobile Safari делает вид, что наводит курсор на что-либо и доступно ли что-либо из этого через события Javascript.

Я знаю, что мог бы написать версию своего всплывающего кода, который бы работал специально для Mobile Safari, но мне кажется гораздо эффективнее заставить браузер выполнять большую часть тяжелой работы, имитируя парящие события. Если бы я только мог разобраться с этим последним маленьким кусочком.

Ответы [ 2 ]

0 голосов
/ 25 ноября 2011

tl; др, но попробуйте это:

# :hover fix
# e.g.: body:not(.stoppedhovering) .styled:hover
hoverFix = ->
  window.clearTimeout hoverFix.delay if hoverFix.delay?
  $('body').removeClass 'stoppedhovering'
  delayed = -> $('body').addClass 'stoppedhovering'
  hoverFix.delay = _.delay delayed, 600
$('*').live 'touchstart', hoverFix
0 голосов
/ 24 сентября 2011

Я предполагаю, что состояние наведения связано с тем, какой элемент имеет фокус, а не как флаг.Одно нажатие дает фокус, второе нажатие активирует ссылку.

Попробуйте закрыть всплывающее окно, выделив другой элемент, и посмотрите, получится ли это лучше

...