I'm building a web-app and I would like to display it as a full-screen app in Windows 8. The result should be something else like in safari on an apple iPad:
Safari:
I've added these two meta-tags in my index.html:
<meta name="apple-mobile-web-app-capable" content="yes">
<meta name="apple-mobile-web-app-capable" content="yes">
Then I opened my web-app in the safari of my iPad and added the site to my homescreen. After this, I got an icon on my homescreen and when I open it, there is my web-app in full-screen, without the browser-containers around it.
Can I do something else with the same web-app on Windows 8? I thought, I could create a metro app, when I add the site to my apps in Internet Explorer. But I think, I also need some meta tags. I found many tutorials on the web, but nothing worked for me.
I suggest that you create a Windows Hosted Web App
http://microsoftedge.github.io/WebAppsDocs/en-US/win10/HWA.htm
Using the Microsoft App Studio, you can do it in minutes
http://appstudio.windows.com/projects/create
Related
Is there any ways, we can use Edge webview instead of IE webview for windows 8.1 apps? As i know, Windows 8.1 app runs on Windows 10 too but i just want to update the webview. Only windows 10 apps supports edge webview.
If i migrate my app from 8.1 to 10 (universal) then lots of things needs to be changed and that will introduce much complexity and consume more time in my app. So, i want to stick with windows 8.1 and just update the webview to edge. Is it possible?
I tried <meta http-equiv="X-UA-Compatible" content="IE=Edge" /> but it still renders on IE webview (navigator command in console)
Thank you for your help.
I've created a mobile webbased game and use the "Add to homescreen" feature to allow users to add it as an app to their iOS devices.
However, recently it started malfunctioning. It has always worked without problem but started acting up possibly after the iOS 8.3 update. This is the code in my head, which has not been changed recently so should not be the problem:
<meta name="viewport" content="width=590px, user-scalable=0">
<meta name="apple-mobile-web-app-capable" content="yes">
<meta name="apple-mobile-web-app-status-bar-style" content="black-translucent">
When I get to the login screen it works without problem, however after logging in in landscape there are suddenly margins to the left and right. If I log in in portrait there are no margins. If I rotate the phone from landscape with margins to portrait it displays normally, if I rotate it back the margins suddenly increase by a lot and if I then try to rotate the device again it crashes.
I have taken some screens to show the problem:
http://i.imgur.com/o2Jr8af.png
http://i.imgur.com/Q6ZOXuj.png
http://i.imgur.com/7bGoc42.png
http://i.imgur.com/Mh8hsml.png
After that last screenshot the webapp just crashes. It only shows this behaviour in the webapp, if I access the game through Safari, my Android app (which loads the website in WebView) or the desktop with a simulated user-agent the website functions properly.
I've tried deleting the webapp, rebooting my phone and adding it back to my homescreen to no avail. I first guessed it was a caching issue but that should have been then resolved after viewing the website correctly in Safari.
For those wanting to try themselves, the game is www.reincarnationgame.com
I have a simple Ember app I've made to learn Ember and I deployed it to Heroku here. When I view it on my desktop and resize the browser window it adjusts accordingly to its mobile view. However, when I look at it on my phone it only displays it as a normal desktop page.
Is this an issue with Ember, Heroku, or Foundation 5?
You need to add to the head of your app.
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
I can see that you have it included in your app on github but in the browser that meta tag is not being displayed.
I have an ember app using foundation on heroku here. It is working well on my phone. The code is here.
Cheers
I have a web app with apple icons that works well on ios devices.
A user has added the app to the homescreen of his windows phone. but how to i set the icon/start image.
both big and small accordingly.
https://skydrive.live.com/?cid=a280c0590d6c6362&id=A280C0590D6C6362%21834&sff=1&authkey=!AAq6YDSK2FwJu9c
the web app
[redacted]
google search appears fruitless.
found this on another website that had mobile functionality.
<meta name="msapplication-TileColor" content="#ffffff"/>
<meta name="msapplication-TileImage" content="img/favicon-msapplication-tileimage.png"/>
I'm writing this in regard to the infamous problem with IOS 6 where geolocation in web apps break oftenly. The only solution was to remove the
<meta name="apple-mobile-web-app-capable" content="yes" />
line from the index which solves this issue as it causes the web application to be a regular browser application. The problem i've encountered is that even with this solution, all currently installed Home screen applications still don't work (use the old index) and only when installing the web app again in the home screen the solution works.
What exactly is the problem here? is the previous home screen apps cache the index? is there a way to solve this?
Thanks