Jack
Jack

Reputation: 513

Options are ignored when using window.open()

I am using the below to open a new window, but it seems that the options are ignored.

var newWindow = window.open('index.php?ident=' + gender + '&nick=' + nickname + '', 'PopupChat', 'directories=no,location=no,menubar=no,titlebar=no,toolbar=no,scrollbars=yes,status=no, width=' + w + ', height=' + h + ', top=' + top + ', left=' + left);

I have tested using Chrome, I still get an address bar etc.

Upvotes: 0

Views: 1900

Answers (1)

T.J. Crowder
T.J. Crowder

Reputation: 1075209

Historically, browsers have been incredibly picky about the options string, and spaces are/were not allowed. You have spaces before some of the options:

var newWindow = window.open('index.php?ident=' + gender + '&nick=' + nickname + '', 'PopupChat', 'directories=no,location=no,menubar=no,titlebar=no,toolbar=no,scrollbars=yes,status=no, width=' + w + ', height=' + h + ', top=' + top + ', left=' + left);
// Here --------------------------------------------------------------------------------------------------------------------------------------------------------------------------------^----------------^-----------------^----------------^

From MDN:

The string must not contain any whitespace

Removing them may solve the problem.

Separately, if the values in w, h, top, and left are anything but raw numbers, they'll cause trouble as well.

Working example: If I put this on a server and run it with Chrome (or Firefox or IE11), it opens Stack Overflow in a window with the options requested (except addressbar, which you can't suppress anymore):

<!DOCTYPE html>
<html>
<head>
  <meta charset="utf-8">
  <title>Foo</title>
</head>
<body>
  <input type="button" id="the-button" value="Click me">
<script>
  var w = 400, h = 600; top = 1, left = 1;
  document.getElementById("the-button").onclick = function() {
    var newWindow = window.open('http://stackoverflow.com', 'PopupChat', 'directories=no,location=no,menubar=no,titlebar=no,toolbar=no,scrollbars=yes,status=no,width=' + w + ',height=' + h + ',top=' + top + ',left=' + left);
  };
</script>
</body>
</html>

Upvotes: 1

Related Questions