Iphone add to home screen issue - javascript

I have added this http://cubiq.org/add-to-home-screen plugin to a website and it works ok but I have a question. For a better understanding I will describe the scenario.
SCENARIO:
The user enters the site and the add to home screen pop-up appears, he taps the add to home screen icon and adds it to his iPhone homescreen.So far so good. He enters the site from the homescreen icon and whenever he taps a link it will open in a SAFARI window not in the current window. The desired beahviour would be to let the user in the current fullscreen window not to redirect him to a regular safari window. NONE of the links have target _blank. Is this an iPhone bug or is it a "normal" behaviour ?

Related

Disable pull down to exit full screen mode on safari ios

My team is developing a web application which has a full screen option in some sections. On Chrome, FireFox and Edge, the full screen option works fine. However, on safari ios, when entering full screen mode, if users touch and pull down the screen, it will exit full screen mode. Is there anyway to disable this action?
The only way I know to solve this is to have your users add the site to the home screen.
I think you can also detect if it's been opened via the home screen.

iFrame FancyBox 2.1.4 in iOS - Iframe Scrolls up After Interacting with Div Using Javascript

When moving and displaying a div in a Fancybox iFrame (using javascript) in iOS devices, the iframe scrolls to top of the window and the user has to scroll back down to see the div. In non-iOS devices the div is moved into view without the iFrame scrolling up (which is what I want).
https://embed.plnkr.co/MhUHCeAaN6VVsllmovTj/
Steps to reproduce:
Navigate to the above url on an iPad using Safari
Tap "Open Fancy Box"
Scroll down and tap the "Click ME!" button
Notice the iFrame scrolls to the top.
The button creates a div, moves it to the top right of the point that was tapped, and makes it visible.
I confirmed this behavior on:
iPad (iOS 11.2.6)
Safari
Chrome
Mozilla Firefox
iPhone (iOS 11.2.6)
Safari
I confirmed this behavior does not happen on:
Windows 10
Safari (v 5.1.7)
Chrome
Mozilla Firefox
Android (7.0)
Chrome
I have tried the answer provided in this thread: fancybox2 / fancybox causes page to to jump to the top, but the iFrame still scrolls up after the button is tapped, and then locks the iFrame so you can't scroll back down.
I also tried using jQuery to scroll to the desired div (selecting with an id) after the onclick function finishes, but the iFrame doesn't move. Using "SLaks" suggestion here: How do you scroll an iframe from within using jquery?
I agree with Janis, this seems to be an issue with iOS specifically. So, I will create or upvote a corresponding bug ticket on the Apple website.

Closing keyboard takes to the top of the page safari

One my webpage I have a bootstrap model opened which has a form with two text boxes and few buttons. When I touch text box keyboard opens which is what I would expect but when I press done (on top of open keyboard) to close keyboard, safari on iPhone it scrolls all the way to the top of the page. This is causing model to loose focus and scroll events are being sent to underlying main page. So the question is, is there any way to get keyboard close event so that I can override this behaviour or any other way prevent it from happening. It's only happening on iPhone chrome and iPhone safari. It works fine on android chrome.

Force Chrome (38) to exit full screen mode

I have a webpage that uses the history api to navigate between pages without complete page refreshs. It all worked great on desktop and mobiles until the last chrome update (38.0.2125.102) on Android (4.4.2).
The problem is with the full screen mode of the browser: when the user comes to our site there's a link to a video gallery, he clicks it and a lightbox opens up with a vimeo embedded video in it. He then taps the video to watch it and it goes fullsceen (a message appears on top that the browser is in fullscreen mode). If the user closes the video like suggested (by dragging down from the top) everything works as expected, but if he taps the devices 'back' button, the browser kinda closes the video (I can still hear it play somewhere) but doesn't really leave the full screen mode (messing up stuff until the user drags from the top).
I'm able to detect when the user has tapped that button, and my question is can I force the browser to leave the fullscreen mode through javascript?
Thanks
As stated on the comment above:
On back button click you can check if the current document is in full screen (document.webkitIsFullScreen) and in case cancel it (document.webkitCancelFullScreen();).

Process Javascript in inactive tab on iPad

I have this solution that takes the user through a series of questions. At the end the user can click a button that opens a new window with a form to enter contact info. The population of this popup window is done through JavaScript from the calling window.
The process (in JS) is this:
Open popup window with loading gif
Store additional information remotely through ajax
Populate popup window with contact form
This all works fine in desktop browsers but not on iPads (using Safari where all windows are displayed as tabs). I have a suspicion that the JavaScript in the parent tab is halted when the "popup" tab gets displayed. To support this theory I can actually get the popup tab populated if I switch back to the parent tab immediately after the popup tab is displayed.
Can anyone confirm this? And of course if there's a solution I would very much like to hear about it.
Needless to say it works like a charm on my Android tablet :-)
Try using window focus and blur to activate some javascript when the focus is back on your tab.
See: https://stackoverflow.com/a/3479936/1712686

Categories

Resources