Open a window behind the current window using Javascript/jQuery

Question

I want to open a window on click, but I want to open it behind the current window, or when the new window opens it should minimize itself. I have made a function but it actually did not work.

<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>Untitled Document</title>
<script type="text/javascript">
function wn(){
  var mm=window.open('http://www.google.com','newwindow','width=200, height=200', "_blank");
}
</script>
</head>
<body>
<a href="#" onclick="wn()">click</a>
</body>

Sounds dangerously like those on-click, annoying, popup ads... — dda, Jul 10 '12 at 05:36
Google "popunder." Basically you do window.open followed by window.focus. — Dagg Nabbit, Jul 10 '12 at 05:47
i just forgot to include child window code can you please include that code in you child window and check it out ...this will work for you — Pranay Rana, Jul 17 '12 at 08:11

score 20 · Accepted Answer · edited Mar 06 '18 at 12:44

20

EDIT

Parent window HTML

<script language="JavaScript" type="text/javascript">
function openPopUP() {
  window.open('mywindow.html','NewWin',
            'toolbar=no,status=no,width=350,height=135')
}
</script>

<body onLoad="openPopUP();">
or
<a href="javascript:openPopUP();">Click to open popup</a>

Child Window i.e PopUp Window File

The below script should be in the child window. The child window will open and will automatically be hidden after 1 second. The value 1000 specified in the setTimeout method is the duration in milliseconds for which the child window will be open. You can increase this timeout duration if you want the child window to be open longer.

<body onLoad="setTimeout('window.blur()', 1000);" 
          onFocus="setTimeout('window.blur()', 1000);">

This might work for you: Add this line of code in the onload event of your child window...

window.parent.opener.focus();

edited Mar 06 '18 at 12:44

Sarath Chandra

1,850
19
40

answered Jul 10 '12 at 05:40

Pranay Rana

175,020
35
237
263

1

no it is not working. popup open and it still infront of parent window – Jitender Jul 17 '12 at 04:27
@amit - its popup the window and hide in 1 sec that normal nature thats how it works...there might not be other way to do this.. – Pranay Rana Jul 17 '12 at 05:38
may be i am doing something wrong. i have put my code in jsfiddle can u pls have look – Jitender Jul 17 '12 at 06:50
@amit- i just forgot to include child window code can you please include that code in you child window and check it out ...this will work for you – Pranay Rana Jul 17 '12 at 08:03
If we don't have any control in child window, how can we hide the popupwindow behind the parent window? – Tinoy Jameson Jan 03 '19 at 09:21

score 13 · Answer 2 · answered Jul 12 '12 at 11:50

13

popunder = window.open('http://www.google.com','newwindow','width=200, height=200', "_blank");
popunder.blur();
window.focus();

answered Jul 12 '12 at 11:50

odupont

1,946
13
16

1

Not sure if browsers have wised up to this technique, but this does NOT work in either FF or Chrome these days. Popup stays in front. – Brade Mar 25 '14 at 23:00

score 6 · Answer 3 · edited Aug 01 '12 at 12:30

6

Try something like this.

window.open(url); 
self.focus();

edited Aug 01 '12 at 12:30

Pranay Rana

175,020
35
237
263

answered Jul 13 '12 at 02:22

Rorchackh

2,113
5
22
38

score 5 · Answer 4 · edited Aug 01 '12 at 12:30

5

Although it causes security issues, but I guess one of the way to do it is :

popup = window.open('http://www.google.com', 'newwindow',  "_blank");
popup.blur();

This will work only in IE. For other browsers you need to set the security level to minimum.

edited Aug 01 '12 at 12:30

Pranay Rana

175,020
35
237
263

answered Jul 17 '12 at 09:52

NG.

5,695
2
19
30

score 3 · Answer 5 · edited Jul 18 '12 at 06:33

3

popunder = window.open('your_site_url','newwindow','width=500, height=500', "_blank");
popunder.blur();
window.focus();

or simply

window.open(url); self.focus();

edited Jul 18 '12 at 06:33

Jason Sturges

15,855
14
59
80

answered Jul 18 '12 at 06:11

Hiren Soni

574
3
11

score 2 · Answer 6 · edited Apr 25 '18 at 18:49

If you want real popunder capabilities there is a great jQuery plugin to handle it at https://github.com/hpbuniat/jquery-popunder

It uses a combination of various techniques to accomplish it across various browsers. Not all browsers can handle it the same but the results are very similar.

Current browser compatibility is listed as: ^{(last updated April '18)}

Mozilla Firefox 3-57
Google Chrome 10-62
Microsoft Internet Explorer 6-11 -- MSIE 6-8 requires jquery 1.x
Apple Safari 5

score 1 · Answer 7 · edited Dec 04 '15 at 11:37

1

Finally , it was working for me only in chrome browser. Add this code in Parent window:

<script type="text/javascript" language="javascript"> 
    function popWindow() 
    { 
    var popupo = window.open("popup.html", 'newwindow','toolbar=no,status=no,width=650,height=450', "_blank");
    popupo.moveTo(0, 0);
    popunder.blur();
    window.focus();
    } 
</script>

Add this code in child window body onload event as

<body onLoad="setTimeout('window.blur()', 1000);" onFocus="setTimeout('window.blur()', 1000);">

edited Dec 04 '15 at 11:37

Bartłomiej Semańczyk

59,234
49
233
358

answered Dec 04 '15 at 11:21

Karthik Linga

11
4

where did you set `popunder` or was that a copy/paste from the accepted answer? – Fr0zenFyr Sep 06 '18 at 13:12

score 0 · Answer 8 · edited Mar 10 '22 at 00:17

Insted of a new window, we can create an iframe and open your url in the iframe and then make the iframe display none also print the iframe content if you want.

var ifrmId = 1;
jQuery(document).on('click', '.myFunc', function(e) {
    var url = 'www.xyz.com';
    var ifrm = document.createElement("iframe");
    ifrm.setAttribute("src", url);
    ifrm.setAttribute("id", ifrmId);
    document.body.appendChild(ifrm);
    window.frames[ifrmId].focus();
    window.frames[ifrmId].contentWindow.print();
    document.getElementById(ifrmId).style.display = "none";
    ifrmId = ifrmId + 1;

});

Open a window behind the current window using Javascript/jQuery

8 Answers8

Linked