Touch2me
@Touch2me
QA в Raketa.travel

Как запретить зум при дабл-тапе и увеличить скорость отклика кнопки?

Добрый день.
Есть веб-страница с кнопкой нажимая на которую происходит прибавление счетчика. Но по сценарию использования эта веб страница в 99% случаев будет использоваться с мобильного и кнопка жаться иногда ОЧЕНЬ часто.

Отсюда возникает 2 проблемы:
1) При двойном тапе происходит приближение на кнопку (надо это убить)
2) Кнопка не отрабатывает частые нажатия и каунтер не прибавляется

Код кнопки:
<script type="text/javascript">
    var clicks = localStorage.getItem('clicks') || 0;
    
    
    
    document.addEventListener("DOMContentLoaded", function(){ document.getElementById("clicks").innerHTML = localStorage.getItem('clicks') || 0; });
    function onClick() {
      clicks = +clicks + 1;
      document.getElementById("clicks").innerHTML = clicks;
      updateStorage(clicks);
    };

    function onReset() {
      if (confirm('Вы уверенны? Данные обнулятся!')) {
        clicks = 0;
        document.getElementById("clicks").innerHTML = clicks;
        updateStorage(clicks);
      }
    }

    function updateStorage(clicks) {
      localStorage.setItem('clicks', clicks);
    }
    </script>
  • Вопрос задан
  • 642 просмотра
Решения вопроса 1
irishmann
@irishmann
Научись пользоваться дебаггером
запретить зум при дабл-тапе

Добавить touch-action: manipulation в css к элементу, у которого отключаем

.disable-dbl-tap-zoom {
    touch-action: manipulation;
}


Кнопка не отрабатывает частые нажатия и каунтер не прибавляется

Обрабатывать нажатия асинхронно
Ответ написан
Пригласить эксперта
Ваш ответ на вопрос

Войдите, чтобы написать ответ

Похожие вопросы