In Safari Mobile on iOS <8, all Javascript was paused while the user was scrolling. Since the release of iOS 8, this is no longer the case, as you can read here:
http://developer.telerik.com/featured/scroll-event-change-ios-8-big-deal/
This is great news. Executing Javascript while scrolling (if done right), opens the possibility for many usability enhancements (like sticky menus) and effects (like parallax).
Is there a way to get the same thing in Chrome Mobile on iOS?
The same website states that the first mobile browser that supported live scroll events was Chrome on Android 4.0. If that's the case, why is it still disabled in the newest Chrome on iOS?
This might be the answer:
https://code.google.com/p/chromium/issues/detail?id=423444
If the new Javascript handling is tied to the new Nitro Javascript Engine used in Safari Mobile (and in WKWebView), then we will have continuous scroll events in Chrome Mobile as soon as they switch to use WKWebView instead of UIWebView.
EDIT: As of version 48.0.2564.87, Chrome uses WKWebView on iOS, and continuous scroll events are working!
Related
I have implemented reading the touch force for haptic touchscreen as per https://developer.mozilla.org/en-US/docs/Web/API/Touch/force
If I test in chrome debug tools on a PC (set to mobile) then it will register the force as 1 (as far as I can tell there's no way to simulate a different pressure). So I know the code it correct.
However on my iPhone XR which does have a haptic screen it always registers as 0.
The compatibility table says Safari on iOS support it, and I haven't been able to find anything that says you need to request the user permission for the feature (like you would with device orientation).
Any ideas why it isn't working?
on caniuse you have more details on support for iOs Safari, please check your safari iOs version is >= 14.5.
I am making use of an external JavaScript library qTip. My application has a feature of 'StarRating' and 'Comments', which is provided through this plugin.
After providing a rating through the stars, one can enter the Comments(optional), which opens up in a dialog.
This scenario works well across all the major browsers i.e. Chrome FF and IE but not in IE (touch devices) and Edge browser (touch devices). As soon as the stars are clicked and on focus inside the input box, the dialog box disappears in the touch devices with IE and Edge only, but works well in Chrome and FF (touch enabled).
I don't know whether there is an issue with the library or with the touch events.
Microsoft Edge doesn't support touch events by default. It has an alternative system called pointer events. Sometimes 3rd party libs implement touch based widgets that don't play well with pointers. A quick way to determine if this is the case is to switch on touch events inside of Edge. Put about:flags in the address bar then go to the setting enable touch event and change it to always.
If the site now works, then I suspect it's an issue with the library. If that is the issue then I'd raise the issue with qTip they can probably help identify the issue specifically so that it can be fixed in the library.
It used to be (before iOS 8) that Safari couldn't natively animate on scroll, you had to stop scrolling to see the animations. Safari solved that issue, but when accessing the same website on Chrome (running in iOS) the issue persists. I read that chrome hasn't yet updated this on iOS. I know that it works great on Android... so... Is there a way to test for this "feature" either with modernizr or other js? I would like to disable animations on scroll if they are not supported. I've been able to accomplish this by checking which browser the user is using, but it would be easier if I could just check whether the functionality is available.
Before iOS 8, iOS would pause painting while the user was scrolling. This behavior was discontinued for applications using WKWebView but remains for browsers using UIWebView — this is why you only see the old behavior for certain third-party applications.
One approach is to detect whether your page is loaded inside WKWebView or not. An answer to another question suggests testing for indexedDB support. indexedDB is the only HTML5 feature difference between the WKWebView and UIWebView.
The snippet from the other answer suggests how to do this:
if (navigator.platform.substr(0,2) === 'iP'){
//iOS (iPhone, iPod or iPad)
if (window.indexedDB) {
//WKWebView
}
}
I have encounter a problem with Chrome that is similar to an older issue with Firefox at this URL: Scrolling blocks javascript execution in Firefox.
I used the jsfiddle example script that was provided in the other link above to verify the problem with Chrome (version 44.0.2403.67).
This issue is present on iPads and iPhones.
This can cause real clunky behavior in certain scenarios for Web applications like we are developing.
Update
Use Model
While the user scrolls, I have a timer in the background that periodically adds more items to the search list that he/she is viewing. This works fine for all supported OSs/Browsers/devices except for Chrome on iPad/iPhone devices
Does anyone know of a workaround?
Thanks...
Can mobile web apps run in the background? I'm mostly interest in iOS & Android.
Thanks!
Since this is a situation that changes almost daily, I'll post an updated answer. This applies to the recent releases of these browsers but may change tomorrow!
My music app is HTML5 and needs to run in the background. The support for that varies depending on mobile browser.
Safari on iOS: will continue to play one or two songs in the background
Native browser on Android: will play one song then stops
Firefox on Android: will stop when screen locks or browser loses focus or song ends
Dolphin on Android: plays in background but eventually stops
Opera on Android: Excellent background support! Javascript continues to run and music continues to play even when screen is off or Opera is sent to the background. Opera even puts a play/pause toggle into the notification page. Yay.
Here is a related SO question.
Nope, they can't. On Android you could conceivably install a different browser, but it's not possible on the stock one. #jgillman points out the exception of audio in iOS but that's the only exception I'm aware of.
iOS allows audio from a web app (Mobile Safari) to be played in the background. I don't know about other events though.
You can't run web app in the background. To enable most of the native features, you should develop native application.
At the time of this answer, Firefox mobile and Opera mobile for Android do allow javascript to run in the background, even with the screen locked.