Я создаю адаптивное веб-приложение и сталкиваюсь с проблемой, которую пытаюсь решить в течение 3 дней без какого-либо приемлемого решения.
Я использую класс css с селектором: hover, который расширяет an HTML -Element.
Хотя: hover не работает при касании, мое устройство android фильтрует это при правильном движении. Прикосновение внутри элемента расширит его, а другое прикосновение в другом месте (но снаружи) «снимет наведение» и снова сожмет. Если теперь я захочу прокрутить и нажать внутри класса «hover», он не будет расширяться, и телефон будет прокручиваться! Это довольно приятно, и именно так я предпочитаю переводить наведение без лишнего кода.
Однако мой IPhone сводит меня с ума. Он распознает «первое касание» и расширяет HTML -элемент, даже если я хочу прокрутить, и он действительно расширяет HTML -элемент. Нажатие / прокрутка дает тот же результат.
Я хочу CSS -Только решение, но могу найти только старые сообщения с большим количеством JavaScript, которые я намеренно не хочу реализовывать, если бы мог быть другой способ.
Другой способ Я хочу избежать получения горизонтального разрешения и изменения классов с помощью скрипта ..
<div class="iphoneHover">
</div>
.iphoneHover {
background-color: #06d6a0;
width: 200px;
height: 200px;
}
.iphoneHover:hover {
background-color: red;
width: 350px;
height: 350px;
}
JsFiddle: https://jsfiddle.net/reaj9s1x/2/
С уважением!