У меня есть веб-сайт, на котором: hover определен в CSS для браузеров, поддерживающих hover.CSS .has_hover a:hover {color:red;}
находится в заголовке, а javascript - прямо перед тегом </body>
.
var canHover = !(matchMedia('(hover: none)').matches);
if (canHover) {
document.body.classList.add('has_hover');
}
В Safari (v11.1.2 на OS X 10.11.6) наведение работает с перебоями (работает для всех ссылок или без ссылок).Если щелкнуть ссылку правой кнопкой мыши, наведение начнет работать только для этой ссылки.Если страница проверена и: hover применяется в инструментах разработчика для какой-либо ссылки, наведение начинает работать для всех ссылок.Если я изменяю размер окна, наведение начинает работать для всех ссылок.
Я думаю, это как-то связано с синхронизацией JavaScript при добавлении класса в тег body.Мне удалось повторить эту проблему в CodePen, задержав выполнение кода JavaScript.
https://codepen.io/ejg/pen/LaNEXK
Есть ли способ заставить Safari распознать hover без повторного рендеринга страницы?