Click does not work on iPad when pressed for too long - html

I have developed a webapp which we usually run on an ipads browser, usually Chrome. There is a problem for a older users when they need to press on a button. They usually press hard and longer than average users, thus the click never gets registered.
The app is an angular app and I've tried to bind a (mousedown) event in hopes of making it fire the event when first touch it. But it seems like that when you hold it down longer on an ipad, it just starts to focus on the text.
Any ideas on how to improve the UX in this case? A lot of older users gets frustrated because to them it does not work.

When you hold your finger on the button you may never reach the mouse events, especially if you move your finger a little. You may check the order of events here https://patrickhlauke.github.io/touch/tests/event-listener_all-no-timings.html
To handle your issue you may handle either pointerdown or touchstart event.

Related

When will SpeechSynthesis.speak work on iOS Safari?

I've been exploring the limits on SpeechSynthesis.speak on iOS Safari. I believe the current rules are more restrictive than there were in the recent past.
Are the rules documented anywhere?
These are the rules that I think apply.
Speak in direct response to a click on a <button> always works.
After the initial speak initiated by a button click additional speaks are allowed on the same page. They may be triggered programmatically by timers or whatever.
Initial speak on a change/input event does not work.
Initial speak on a click event on a <tr> does not work.
Any change of page, relative or not, puts you back to square one requiring a direct user action.
When a speak is suppressed you don't get any events nor any error indication.
You want tell if the speak was suppressed by watching for SpeechSynthesis.speaking and timing out if it isn't seen after some delay.
Are these consistent with your recent experience?
I've been testing on BrowserStack watching the events that get fired to determine which cases work.
I can confirm that you can't use SpeechSynthesisUtterance programmatically without a user action before. In my case I have in my web app a button to enable/disable audio, if the user enable the audio and later I try to speak something, it doesn't work
To solve it I had to trigger a fake speak (empty text new SpeechSynthesisUtterance('')) right after the user click on enable audio and then the audio works during all the session.

What happened from you touch the screen till iOS app receive the click event?

There is a button in the middle of an app. After you touch the screen and click on it, you receive a click event on the button. What happened in the middle?
I used to face a bug, use the UIWebView, one input element in an HTML can't response the click event, but the WkWebview can.
Now I want to confirm the question below:
What happened from you touch the screen till iOS app receive the click event?
After I had viewed the Woodstock's answer. I edit this question.
Don't consider the hardware, just think the iOS system.
There are multiple events triggered, for example:
Finger down, Finger moved, Finger Up.
Additionally there are events for where that occurred, e.g. inside or outside a control.
If you are asking what's happening in the quantum between contact with the capacitive display and the processing of the event by iOS this is not well defined.
Suffice to say, clock cycles and processing :)

Reliably detect if a user is using a mouse on a webpage?

On our page we have some iframes in a long horizontally-scrolling <div>. If the user is using a mouse they can scroll with the scrollbars and we would like them to be able to select text within the iframes. If they are using touch only however, the scrollbars are a hassle and I would like to overlay a transparent element over the whole thing to give them the ability to scroll easily by dragging, this of course sacrifices the select-text feature but makes sense in that scenario.
Which gets me to my question, is there a way to reliably detect if a user is interacting with a webpage via a mouse?
Everything I've seen on detecting touch or mouse is that touch will broadcast mouse events so it is very difficult to detect touch OR mouse (not to mention that you can have both). My problem is simpler - it is whether the user has interacted with the page via a mouse.
Can anyone think of a way to check this reliably?
A mouse can do one single thing a touch device can never do - move without having any buttons pressed. So I'd just install an onMouseMove event on page load, and if it triggers without buttons pressed mark the user as a mouse user. You could then persist this through a cookie or LocalStorage since the flag will not change within the same environment, and remove the event right away. The precise way of implementing the single-fire event depends on which library you use (if any at all), but it should be easy with Mootools/JQuery docs in hand.
In general I'd recommend the easier route of just checking for a touch interface in most cases :
if('ontouchstart'in window)
{
/* it's a touch device */
}

Apple Safari Buttons onclick takes to long

i have a simple system to register who is present at a party.
I created an easy numkeypad with buttons, and that works. But when I try it in Safari (or any other mobile browser), it takes about a second before I can press the next button. It has to be quick, so this is too long.
Is there any way to shorten this "waiting" time between button presses.
click events are delayed in mobile browsers due to the fact the browser has to ensure the user isn't double-tapping or tap-holding an element.
I have written a jQuery plugin that can handle touch and mouse events in a convenient way, and allows you to bind one event to trigger without a delay (tap). You can check it out here:
https://github.com/benmajor/jQuery-Mobile-Events

Disable back space key for browser based AS3 application

this is insanely annoying problem:
AS3 full screen application based on ADOBE FLEX 4, text field. User types something in text field, and then starts clicking backspace many many times to remove what he just wrote, and for some reason, instead of removing characters from text field it tells browser to GO BACK and user navigates away. Why?! Please, please help, this is so terrible. My users are losing important unsaved this is data while using my application!
i am using safari browser
PLEASE HELP.
Wow, this is terrible, I am so irritated, it happens every single time
It is possible that the focus is lost from your text field when hitting the backspace multiple times (check if you are firing some events on the text field that may cause this), which causes the main window to take focus and trigger 'Back' on the browser.
The root of the problem is that the browser carries out keyboard shortcuts REGARDLESS of the flash app having the focus or not. From what I heard this problem does not exist on Safari's for Mac, only Safari for Windows.
I would check to see what browser you are in and then create a popup saying you this app does NOT work on Safari browser ON windows.
Scratching head*
Well maybe if HAD to solve this, I would use the ExternalInterface to interact with Safari or javascript to PREVENT the history back button from getting applied. So it won't go back to an old page. That is what I would look into.