Longtouch Buttons

Note: open this test page with a mobile / touch screen device or simulate a mobile device using the web debugger of your browser.

The buttons below should work normally on a non-touch device.

On a touch screen device, touching the buttons starts a countdown of 1.5 seconds, showing an overlay with a progress bar and giving vibration signals (on devices supporting this). The button action is triggered only after the countdown has finished while holding the touch.

This feature is meant to a) secure certain buttons against unintentional activation and to b) allow secure usage of these buttons while driving, i.e. when the mobile phone / tablet is mounted to a car holder.

Standard candidates for this are buttons triggering deep modifications, i.e. changing the car tuning or drive mode.

To activate the feature on a button, simply add the class `btn-longtouch` to the button. To activate it on a group of buttons, add the class to the container of the buttons.

The progress overlay shows the button title if set (HTML supported), else the button text.