Как отключить функцию двойного увеличения в Chrome 30 на Android (Nexus 10)

Question

Можно ли отключить масштабирование контекста, вызванное двойным касанием элемента в Chrome? (Настройка: Nexus 10 | Android 4.3 | Chrome 30).

Двойное касание не является одним из родных событий касания (touchstart, touchend и т. Д.). Кажется, что единственными решениями являются библиотеки, которые сами определяют событие doubletap (jquery-doubletap и hammer.js), но я сталкиваюсь с проблемами при их использовании ( https://github.com/EightMedia/hammer.js/issues/388).

Кто-нибудь может объяснить, как запускается событие doubletap? это, кажется, не элементное событие, а событие, которое обрабатывается самим браузером (каждый браузер диктует свое уникальное поведение).

И наконец, есть ли способ отключить двойное увеличение? Это убийца UX для меня. Благодарю.

Answer 1

В будущих версиях Chrome для Android двойное касание будет удалено, если у вас установлен видовой экран. Если вы хотите отключить его для стабильной версии сегодня, вам нужно установить user-scalable=no в вашем окне просмотра.

Это отключит масштабирование (что может быть плохо для доступности), но должно позволить вам получать все сенсорные события.

Answer 2

Этот код в основном просто предотвращает возможность двойного нажатия. Событие по-прежнему запускается для каждого события сенсорного запуска, поэтому просто поместите любую другую функциональность за пределы оператора if, и вы будете свободны от назойливой функции двойного нажатия.

var time_stamp=0;// Or Date.now()
window.addEventListener("touchstart",function(event_){
if (event_.timeStamp-time_stamp<300){// A tap that occurs less than 300 ms from the last tap will trigger a double tap. This delay may be different between browsers.
    event_.preventDefault();
    return false;// Not sure if you really need this anymore, but whatever.
}
});

Answer 3

Я хотел запретить масштабирование двойным касанием, но разрешить масштабирование с помощью щипка. Я решил это, посмотревevent.touches.lengthи предотвращает событие только в том случае, если длина равна 1 и прошло слишком мало времени.

      function preventDoubleTap(elem) {
  let lastTimeStamp = 0;
  elem.addEventListener('touchstart', (event) => {
    if (event.touches.length === 1) {
      if (event.timeStamp - lastTimeStamp < 300) event.preventDefault();
      lastTimeStamp = event.timeStamp;
    }
  });
}