centering a feedback.js popup window

Question

I found the following JavaScript code many years ago (between 8 and 10 years ago, I think) though I can't remember where or when. I use it to make popup windows with answers for a Jeopardy review game for my French students. I dabble a little bit but I don't know very much beyond the absolute basics about coding (I do know how to change the background color in this code and the window size, for example). I would like to have the popup window be centered in the middle of the page rather than opening in the upper left of the window.

I've seen code bits in response to other questions (Center a popup window on screen? for example) that look like they should make that happen but when I've tried adding them in different places to my existing code it always makes the feedback window no longer open. I don't know enough about coding to know what of that code I need or where to put it. I have tried pulling the VAR lines and adding them to the existing code but as I have said, it disables the popup window completely.

Can someone help me tell me if it is possible to modify this code to center the popup window in the middle of the page or if I should try to find a different code to make that happen?

Thank you for your help. Shannon

Here is the code that I have:

function feedback(message) { 
var browser = navigator.appName;
var browserVersion = navigator.appVersion;

if ((browser.indexOf ("Netscape") >= 0) || (browser.indexOf ("Explorer") >= 0)) {

// This function opens a new window with the message text.
// The window will disappear when it loses focus. 

msgWindow=window.open('','msgWindow','toolbar=no,location=no,directories=no, status=no,menubar=no,scrollbars=yes,resizable=no,copyhistory=no,width=210,height=180');
msgWindow.document.open();
msgWindow.focus();
msgWindow.document.write("<HEAD><TITLE>message</TITLE>");
msgWindow.document.write("</HEAD>");
msgWindow.document.write
("<BODY BGCOLOR='#FAE080' onblur='window.close()'>");
msgWindow.document.write
("<P><CENTER><FONT SIZE=+1><B>" + message + "</FONT></B></P></CENTER>");

msgWindow.document.write("</BODY>");
msgWindow.document.close();

} else { // Not Netscape or Internet Explorer
alert(message);
}

} // end of JavaScript Function feedback

I have looked at those bits of code but I don't know how, if it is possible, to use them/how to integrate them into my code. I'm a French teacher that dabbles in website making. — S. Peyton, Feb 20 '18 at 05:48

Nikhil Ghuse · Answer 1 · 2018-02-21T07:18:16.143

It is not working here in code snippet but you can check this fiddle Check this

function myFunction() {
var pageURL="http://google.com";
  var w = 500;
  var h = 500;
  var left = (screen.width/2)-(w/2);
  var top = (screen.height/2)-(h/2);
    window.open("https://www.google.com",'','width=' + w +', height='+h +',top='+top+',left='+left);
}

<button onclick="myFunction()">Click Here</button>

Your modified Code Will be like this Check updated Fiddle

   function feedback(message) { 
    var browser = navigator.appName;
    var browserVersion = navigator.appVersion;

   if ((browser.indexOf ("Netscape") >= 0) || (browser.indexOf ("Explorer") >= 0)) {

  // This function opens a new window with the message text.
  // The window will disappear when it loses focus. 
   var w = 210;
   var h = 190;
   var left = (screen.width/2)-(w/2);
   var top = (screen.height/2)-(h/2);
   var msgWindow=window.open("",'','width=' + w +', height='+h +',top='+top+',left='+left);
     msgWindow.document.open();
     msgWindow.focus();
     msgWindow.document.write("<HEAD><TITLE>message</TITLE>");
     msgWindow.document.write("</HEAD>");
     msgWindow.document.write("<BODY BGCOLOR='#FAE080' onblur='window.close()'>");
     msgWindow.document.write("<P><CENTER><FONT SIZE=+1><B>" + message + "</FONT></B></P></CENTER>");

    msgWindow.document.write("</BODY>");
    msgWindow.document.close();

  } else { // Not Netscape or Internet Explorer
     alert(message);
  }

  } // end of JavaScript Function feedback

So, how do I integrate this with my existing code? I almost feel like this is something that would replace my code, which is not what I need. Here is an example of what the page does now: http://www.public.asu.edu/~speyton/FRE102Review/Ch6/1/pc-avoir/pc-avoir1.htm — S. Peyton, Feb 20 '18 at 15:38

centering a feedback.js popup window

1 Answers1