5

This is not something we'd normally do but we're trying load a video into the blank window opened by a clickTag (from a banner ad) - and make it feel like a modal window as much as possible.

Is it possible to use javascript to self-resize the blank window opened by the clickTag and center it on the screen?

  • We can't apply anything to the link that is clicked so...
  • Everything has to self-run as the page loads
  • If possible, it would be nice to not see the browser tabs and address bar
  • We're not loading jquery
  • Are browser security alerts a potential problem?

Essentially the user clicks to watch a video and we'd like them to watch the video without them feeling like they've gone to a completely different site.

So far I can resize the window but can't figure out how to center it with:

<script language="javascript">

  function resizeVideoPage(){
    resizeTo(400,390);
    window.focus();
  }
</script> 

// Then...

<body onload="resizeVideoPage();"></body>

Any pointers in the right direction would be much appreciated.

Cheers

Ben

CMSCSS
  • 2,076
  • 9
  • 28
  • 49

2 Answers2

11

Got it working with:

<script language="javascript">

  function resizeVideoPage(){
    var width = 600;
    var height = 400;
    window.resizeTo(width, height);
    window.moveTo(((screen.width - width) / 2), ((screen.height - height) / 2));      
  }
</script>

// Then...

<body onload="resizeVideoPage();"></body>
CMSCSS
  • 2,076
  • 9
  • 28
  • 49
  • Nice and clean way to do it. I simply dropped `` just after the closing head tag and it resizes the window just fine – Elena Dec 11 '15 at 15:32
6

I personally would advice against Popups an Javascript window manipulation. (due to Popup Blockers, Javascript errors, ...) A Overlay would probably be better.

Here would be an other Solution.

File one(Link should point to this Helper, that opens the Video HTML)

<html>
<body>
<script>
    var windowWidth = 400;
    var windowHeight = 200;
    var xPos = (screen.width/2) - (windowWidth/2);
    var yPos = (screen.height/2) - (windowHeight/2);
    window.open("popup.html","POPUP","width=" 
    + windowWidth+",height="+windowHeight +",left="+xPos+",top="+yPos);
</script>
</body>
</html>

File Two (Video that closes Helper)

<html>
<body onload="window.opener.close();">
</body>
</html>
winner_joiner
  • 12,173
  • 4
  • 36
  • 61
  • Thanks for that but the publisher insists on a popup from the banner ad - and we have no control over the link code (Flash clickTag) or the page the link is on. Can your JavaScript be placed into the page we load from the clickTag and run on page load? Cheers – CMSCSS Feb 14 '13 at 05:28
  • If i understand you corrent, i would say it should work. The main Idea, of this 2 scripts was: the AdLink opens "File one" and "File one" opens the real - popup(File two). Than the popup closes the "File one" onload, just leaving the page where the ad was and the Popup. Hop it helps – winner_joiner Feb 14 '13 at 15:25