Jump to content

How to create a web app that looks like a iOS 7 native app (Part 2: Behavior)


triptych
 Share

Recommended Posts

How to create a web app that looks like a iOS 7 native app (Part 2: Behavior)

http://mir.aculo.us/2013/10/10/how-to-create-a-web-app-that-looks-like-a-ios-7-native-app-part-2-behavior/

 

 

One really interesting fact for gamedevs here:

 

The final thing that takes a web app closer to being just like a native app is being able to run full-screen, a thing that has been possible for quite a while now on iOS by saving to the home screen. Just like in previous iOS versions, this is possible in iOS 7 as well. Please note that there are several horrendous bugs in the current incarnation of iOS 7 (like no alert() or confirm() modals, mailto: not working and other issues).

Nevertheless, two small tips with this:

Screen-Shot-2013-10-10-at-10.02.23-AM.pn

Set the apple-mobile-web-app-status-bar-style meta tag’s content to black-translucent to get a fully translucent phone status bar. You can add a class to your body element to indicate that your application is running from the home screen (if (navigator.standalone) $('#body').addClass('standalone')). When that class is active, add the necessary padding to the top of your page.

Link to comment
Share on other sites

Join the conversation

You can post now and register later. If you have an account, sign in now to post with your account.
Note: Your post will require moderator approval before it will be visible.

Guest
Reply to this topic...

×   Pasted as rich text.   Paste as plain text instead

  Only 75 emoji are allowed.

×   Your link has been automatically embedded.   Display as a link instead

×   Your previous content has been restored.   Clear editor

×   You cannot paste images directly. Upload or insert images from URL.

Loading...
 Share

  • Recently Browsing   0 members

    • No registered users viewing this page.
×
×
  • Create New...