1

I have a script that runs on a publisher's site. I want to show an interstitial ad upon entrance to site. I have access to conventional ads. The problem is that publishers treat their mobile sites differently or not at all. You can go to a site with no "meta name="viewport"" and initial scale and/or stumble upon different scales or zooms. So if I have a 320x480 ad, it won't look good in all the 320x480 devices since I don't know the zoom/scale state. As I read, even if I can tell the scale, it's almost impossible to handle it and have a X-Browser support. Open a new window or navigate to my own URL to show the ad is out of the question.

Can you recommend on a solution for this problem? Thanks.

mrgoos
  • 1,294
  • 14
  • 26

1 Answers1

0

OK, no one answered :( So far I thought of this method, will be happy to hear your thoughts.

By reading this answer and this one, I can modify the viewport properties in runtime. That's good and enables me to show the ad on scale 1 regardless the user scale or zoom.

The problem is, how to get back to the previous scale once the ad is not shown anymore? How can I save the current scale/zoom and set it back when I need? Saving the content alone is not enough because the user can change the zoom after page load. Thanks.

EDIT:

So this is what I come up with:

  1. querySelector for the viewport
  2. If exist, save the 'content' data, remove the width if exist and add the CURRENT_WIDTH. If not, create a viewport with only CURRENT_WIDTH as a parameter
  3. Set new attributes to 'content' as follows:

viewport.setAttribute('content', 'width=device-width, minimum-scale=1.0, maximum-scale=1.0, initial-scale=1.0, user-scalable=no');

  1. Restore viewport attributes when needed
Community
  • 1
  • 1
mrgoos
  • 1,294
  • 14
  • 26