[wilsoncortez]

Hi

After some dig around with no effective answer, i´d like to know if there is a definitive way of hiding the Safari address bar within a web app.

I´m trying to get a very very simple app with only a welcome screen and 2 buttons one with an onClick event ( a link to a hosted website) I don´t want to show the Safari address bar. is it possible….how?

I´ve found some javascripts around but don´t know where to put them, for instance:

where a i have to put the code below, on the “onclick” event or in the header of my website???

// When ready...
window.addEventListener("load",function() {
    // Set a timeout...
    setTimeout(function(){
        // Hide the address bar!
        window.scrollTo(0, 1);
    }, 0);
});

and META Tag for Bookmarked Sites

<meta name="apple-mobile-web-app-capable" content="yes" />

Any help will be appreciated,
Thanks

[wilsoncortez]

Octavio

By default the addressbar is hidden if you turn off the addressbar in the Design Center

Sorry but I could not find that option in Design Center, can you please point it to me?

Please watch our video at 2:30 to see an example of a webapp designed with hidden addressbar and then demo’ed in the test center: http://www.youtube.com/watch?v=wr32FxxFkj4&feature=player_embedded

i´ve watched the video twice but could find any mention on hiding the address bar. Maybe i´ve overlooked anything 🙁

Thanks

[support-michael]

Take a look at the attached screenshot that shows the hidden address bar and button/nav bar. If you run this simple webapp in the Test Center or on your iPhone the address bar will be hidden. You do not have to mess with any javascript or meta-tags. That is one of many benefits of using MobiOne..
See attachment addressbar.png

Attachments:

You must be logged in to view attached files.

[wilsoncortez]

Hi Wayne

Than you for your answer however after checking and rechecking when viewing in ios 4.2 my button with the onClick go to url action still leads me to the site but with the safari address bar showing up.

Maybe an ios 4.2 behavior?

Thank you 🙂
PS. the address bar is hidden in design center and in test center, ok? The very only problem is in iPhone 3 GS

[support-michael]

@wilsoncortez

I think I am starting to understand the issue. To confirm you are opening a non-mobione UI in mobile safari. There are no issues with addressbar appearing within a MobiOne webapp, Right? For example, loading an independent UI from mobione is not considered part of your mobione app since mobione plays not part in the creation of the remote webapp. If yes then you are correct that you must implement your own handling for hiding the addressbar. And you can reuse the snippet of javascript code similar to what mobione does in your own web UI.

To also ensure there is no confusion, the GotoURL action loads the remote site into a new DOM just as if you typed in a new URL to a traditional browser address bar. Thus the action can not embed a remote site into a mobioue UI. Doing this is fundamentally impossible on iOS webapps due to an apple bug.

[wilsoncortez]

Hi Wayne

To confirm you are opening a non-mobione UI in mobile safari. There are no issues with addressbar appearing within a MobiOne webapp, Right?

Yep you´re right. From within my little MobiOne app i have a button with the go to url action eg. http://mydomain.com .

If yes then you are correct that you must implement your own handling for hiding the addressbar.

I see …so i must implement this snipet in my index.php or header.php…whatever, right?

And you can reuse the snippet of javascript code similar to what mobione does in your own web UI.

Where can i find it, Wayne?

Thank you very much

[Author]

Posts