Javascript to center popup

Question

I need to open a popup window centered on screen. The approach in this article works well, however I can not have an onclick attribute on the link/button.

I created this JS Fiddle, can anyone please help me combine the two?

// find elements
var button = $("button")
// handle click
button.on("click", function(){
    var left  = ($(window).width()/2)-(500/2),
    top   = ($(window).height()/2)-(700/2),
    popup = window.open ("https://apple.com", "popup", "width=500, height=700, top="+top+", left="+left);
})

It actually doesn't look like you're using the code from the article you linked. The "simple" version that is closest to yours uses `screen` properties. — Jeto, Aug 23 '18 at 14:25
Just call PopupCenter(url, title, w, h) function from inside button click function and pass the calculated values in this. — Arun Kumar, Aug 23 '18 at 14:25

Exceptional NullPointer · Accepted Answer · 2018-08-23T14:37:27.697

Your code works just fine. Please note that $(window) in your example refers to the result iframe.

On jsfiddle it's not possible to calculate the full window size from inside the iframe because it is on another domain (jsfiddle.net vs fiddle.jshell.net). Check out CORS.

Check out this embedded result of your code.

// find elements
var button = $("button")
// handle click
button.on("click", function(){
    var left  = ($(window).width()/2)-(500/2),
    top   = ($(window).height()/2)-(700/2),
    popup = window.open ("https://apple.com", "popup", "width=500, height=700, top="+top+", left="+left);
});

Javascript to center popup

1 Answers1