tylerl
tylerl

Reputation: 1180

iOS Home Screen Bookmark - avoid getting pulled out to mobileSafari?

I'm putting the finishing touches on a mobile web app and I learned that when you add a page to the home screen, clicking on any link will bring the user out of full-screen mode and into mobileSafari, completely destroying the purpose of full-screen mode. How does anyone make use of full-screen mode when all links force you out of it?

Upvotes: 0

Views: 618

Answers (2)

Rick Strahl
Rick Strahl

Reputation: 17651

Any <a href=""> link that is clicked actually navigates and is directed into the native browser, popping out of the 'app' window. All navigation has to be mitigated to script operations, explicitly navigating the browser, or submitting forms via AJAX.

Here's a more common jQuery implementation for the replacement that also manages any future document modifications and anchor additions:

$("body")
       .on("click","a", function () {
           var href = $(this).attr("href");
           if (href) {
               window.location = href;
               return false;
           }
           return true;
       });

Incidentally form submissions appear to work just fine and do not open a new window, so nothing special needs to happen with that.

I tend to put that into startup script that gets pulled into any page. That's either plain script block at the bottom of the page, or something app.run() in Angular.

Upvotes: 2

tylerl
tylerl

Reputation: 1180

I found this comment on a blog:

A quick fix for an existing site (with prototype.js):

document.observe(“click”,function(event){
var element = event.findElement(“a”);
if(element.href){
event.stop();
location.href = element.href; //this does the trick, page will open in same window
return false;
}
});

Source: http://www.luscarpa.com/development/make-your-website-an-iphone-web-application/

Upvotes: 0

Related Questions