使用时如何在iPhone上隐藏网址栏

Question

I have a mobile web page where I want to put an ad for an iOS app at the top of the page using Apple's meta tag like this:

<meta name="apple-itunes-app" content="app-id=myAppStoreID, affiliate-data=myAffiliateData, app-argument=myURL">

So I added that line to my HTML. Then I opened the web page on an iPhone and the ad is there, but it's above the top of the page.

The page uses window.scrollTo(0,1) to hide the url bar on iPhone, but it looks like the add is positioned at -50px, so I could try window.scrollTo(-50,1) but sometimes the ad is there and sometimes it's not. If you click the (X) on the ad, it remembers to not show the ad again until you clear the cache.

Is there a way to know if the ad is showing? Or am I just not able to hide the URL bar with this type of ad?

Thanks!

Answer 1

Try adding the following Apple-specific meta tags at the head of your HTML document.

<meta name="apple-mobile-web-app-capable" content="yes">
<meta name="apple-mobile-web-app-status-bar-style" content="black-translucent">

With the above meta tags, I don't think you still need to call window.scrollTo(0,1) to hide the URL bar

Refer to this documentation Apple-Specific Meta Tag Keys for details.