Touchscreen mouse events

I have a webapp that controls a robot. I have a button that when clicked starts the motor. When it is unclicked it stops the motor. It works well in most browsers, but on my Android phone it doesn’t work as expected. If I press and release the button both mousedown and mouseup events fire. If I press and hold the button the events don’t fire, even after letting go.

Hi Dan, this sounds like a cool project. I’ve had a lot of fun with web buttons (actually, not fun at all). You could try making the button an image instead and put the code in the MouseUp event. This will work for mouse clicks and finger taps and will hopefully make the action more consistent across browsers on different platforms.

Buttons under Android are tricky. Even styling them can be hard.

You can use an image, as Eric suggested, or simply a styled label instead. They should react better with MouseDown and MouseUp.

Mobile browsers are special in that everything is centered around touch and they both (iOS and Android) allow what’s considered a “long press”. Unfortunately I suspect that’s what you’ve got going on here.

Your best bet if you need mobile support will be to create your own control using the WebSDK which can handle the raw touch events on these browsers.

1 Like

Thanks guys for the suggestions! I will do some experimenting today.

I tried the label as it was easiest. It still reacts the same way. If you hold the button down, you do not receive the mouse events. The WebSDK looks way too complicated for me! I don’t really need touch devices so I will live with it.

This topic was automatically closed 182 days after the last reply. New replies are no longer allowed.