When running on iPhone after double tap and hold on second tap, default iPhone text selection magnifier pops up. I would like to remove it, but had no luck so far.
Here is what it looks in the app ( bubble in the center of the screen )
personally iâd wrap all elements with the following and then only apply the opposite settings to the individual elements that would require it, like soâŚ
from a quick flick through some related issues on github it looks like @PavelBoytchevâs suggestion should do it from inside a touchstart event listener but will also prevent any click event listeners from firing, are you using the dblclick event for this?
I donât use iOS personally so i wonât be able to test, the iPhone 6 i use for testing iâm sure is still on iOS 14 alsoâŚ
I need to be using regular touch input. Blocking all input is certainly a solution that would work, but not very practical unfortunately.
I am not using anything myself, itâs happening automaticly. I am not even using any touch events/inputs except for orbit controls.
@Lawrence3DPK The idea with double tap event got me thinking and I did use this function to prevent double tap altogether:
This solves it as the double tap is entirely ignored, so thanks for the suggestion. Not sure, if there is some better solution to catching double tap events. Doubleclick event did not work
window.addEventListener(âdblclickâ, ondblclick, false)
function ondblclick(event)
{ event.preventDefault(); }
ah ok thatâs great, to be fair i didnât even think about the dblclick event not being supported by mobile devices, i just read that itâs not here so if your workaround works it works
So itâs actually still there, itâs just happens less often. Anyways, if you would have some other idea or anyone else, let me know. But thanks for the help.
I think youâve correctly identified the moment youâd like to intercept the event and precent them. But on recent mobile devices, youâll need to pass a third parameter into the event listener to say that the event is not passive. Like so:
Update: Mar 28, 2023
Actually, upon further inspecting your gist, youâre not really gaining any advantage from the setTimeout. Iâve re-written it here:
function createHandler(func, timeout) {
let timer = null;
let pressed = false;
return function() {
if (timer) {
clearTimeout(timer);
}
if (pressed) {
if (func) {
func.apply(this, arguments);
}
clear();
} else {
pressed = true;
setTimeout(clear, timeout || 500);
}
};
function clear() {
timeout = null;
pressed = false;
}
}
// ....
// And you would use it like this:
const ignore = createHandler((e) => e.preventDefault(), 500);
document.body.addEventListener('touchstart', ignore, { passive: false });
For Mobile Safari, the actions go like this:
touchstart
touchend Release quickly
touchstart Second one to hold
Magnifying glass comes up
So, if you want to capture the magnifying glass pick up, you need to intercept that second touchstart â not the end or cancel event.
