Equivalent code for mouse Pointer/click on a touch device?

Custom code
1

Hello,

I’m currently using a fullscreen video file as a pre-loader for my website.
(the video pre-loader essentially acts like a see-through object so that the buttons underneath can still be clicked on)

I’ve managed to achieve this result on web by inputting a tiny bit of code below for ‘Pointer-events’:

Screenshot 2025-03-09 092252
Screenshot 2025-03-09 092252858×270 20.9 KB

The problem is that on mobile or touch screen devices this does not work?

Would there be an equivalent code that I need to input for these devices:
‘touch’, ‘press’, ‘screen’ etc.?

Any help would be greatly appreciated,
Thank you!

2

Mmm, I have not tested this but I think pointer-events: none; should work for both mouse and touch interactions.

There might be some limitations with some mobile browsers though, if so…I guess you can try handling touch interactions using JS.

3

Thanks for your reply - Unfortunately it hasn’t worked on any mobile browsers I’ve tried so far (Chrome, Safari, Samsung Internet, Edge)

Would you mind explaining how that could possibly be done?
Sorry I’m quite a noob when it comes to code, especially with JS

Thanks again!

4

hey, not tested, but you could try it with: touch-action: none;

2 Likes
5

Thanks for your response @neueMeta - I tried inputting that and unfortunately it still doesn’t work.

Interestingly though it does stop the ability to scroll on a touch device, which means it is kind of working because it’s not allowing anything to happen when the object/video is pressed on.

It just seems that it misses the additional step of pressing the button underneath it?