How to disable text selection for mobile long press but preserve haptic feedback?

59 views Asked by At

I'm trying to do the opposite of what this post asks. I'm implementing a functionality on my webpage where long pressing an element on mobile triggers a function.

I used long-press-event here. However, long pressing not only triggers the function but also selects some text on the screen. So I added the following CSS to disable text selection.

body {
    -webkit-user-select: none;
    -khtml-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none;
    -webkit-tap-highlight-color: rgba(0,0,0,0);
}

This disabled text selection but also the haptic feedback that comes with it. Is there a way to prevent this, or should I use something like Capacitor to trigger an artificial vibration?

Testing on iOS Chrome.

0

There are 0 answers