Часто я хочу проверить элемент (например, всплывающую подсказку), который появляется только тогда, когда другой элемент наводится / вводится мышью. Появившийся элемент становится видимым через событие mouseenter в jQuery.
Я не могу проверить всплывающую подсказку, так как всплывающая подсказка исчезает, когда моя мышь покидает содержащий элемент.
Есть ли способ приостановить события JS, чтобы я мог навести курсор на элемент, затем приостановить JS браузера и успешно проверить его?
Например, попробуйте просмотреть всплывающие подсказки начальной загрузки Twitter: http://getbootstrap.com/javascript/#tooltips .
:hover
его, щелкнув правой кнопкой мыши элемент в представлении Elements (DOM) в инструментах разработчика, выбрав «Force Element State», а затем «: hover».Ответы:
В Chrome 38.0.2094.0 это довольно просто.
Вот как это будет выглядеть:
Шаг за шагом:
Если всплывающая подсказка появляется из-за CSS, вот что вы можете сделать в этом случае:
Шаг за шагом:
источник
byzanz-record
. Это пакет, с которым можно получитьsudo apt-get install byzanz
.Оба Сафари и Web Inspector предложения флажков Chrome, где вы можете переключать
:active
,:focus
,:hover
и:visited
состояние элемента. Использовать их может быть еще проще.Сафари:
Хром:
источник
:hover
стилями.:visited
, который ограничен для предотвращения отслеживания) - на вкладке HTML он находится в раскрывающемся списке "Стиль" справа:hover
,:active
или:focus
.Есть еще один хитрый способ сделать это:
Подсказка останется видимой, после чего вы сможете просмотреть ее на вкладке «Элемент».
Проверено в Chrome. Кажется, не работает в Firefox.
источник
Хотя ответ @ SomeGuy отличный (t-up для анимированных гифок), в качестве альтернативы вы всегда можете сделать это программно. Просто откройте консоль и введите название события.
(с чистым синтаксисом javascript может отличаться в зависимости от браузера)
С jQuery еще проще:
В вашем примере ( http://getbootstrap.com/javascript/#tooltips ) откройте консоль и введите, например:
И всплывающая подсказка появляется в DOM и может быть проверена / изменена вручную:
Как и в комментариях, если вы наведете указатель мыши на рамку страницы, вы можете инициировать другие события, такие как
mouseout
. Чтобы предотвратить это, вы можете нажать F8(как в соответствующем ответе) или ввестиdebugger;
(что является его эквивалентом в сценарии)источник
mouseout
), поэтому это не решает проблему в первую очередь. Выбирая его, нужно быть очень осторожным. Но это альтернативный подход.