Advanced Search

View RSS Feed

molendijk

New windows, new tabs and popup blockers

Rate this Entry
(To see and test what this is all about, you should download Safari if you haven't already done so. After that, use the code below with popup blocker enabled AND with popup blocker disabled, using Safari).

When a new window or tab is not explicitly requested by the visitor of a site i.e. when the window's appearance is attached to such events as onload or onunload, popup blockers (if enabled) will prevent a file from being opened. But when the window's appearance is attached to an onclick event on a link (and other events that can be taken to mean that a person has explicitly requested a new window, like the onchange in a select box, see below), the browser won't allow popup blockers to stop windows or tabs from appearing.

Well, not quite so. Sometimes, browsers / popup blockers make mistakes and block windows or tabs although they are explicitly requested by the user. One such example is Safari's treatment of links in the options of a select box. A simple example of a script for opening a new window or tab using the onclick event is the following:
Code:
<script>
function open_in_new_window(url)
{
var wwidth=700;
var lleft=parseInt(screen.width/2)-parseInt(wwidth/2);
the_popup=window.open(url,"_blank","left="+lleft+",width="+wwidth+",height=400, top=100");
}

function open_in_new_tab(url)
{window.open('','_new').location.replace(url)}
</script>


<select onchange="selectedIndex=0; open_in_new_window('http://www.dynamicdrive.com');">
<option disabled="disabled" selected>Destination in new window</option>
<option >Open in new window</option>
</select>

<select onchange="selectedIndex=0; open_in_new_tab('http://www.dynamicdrive.com')">
<option disabled="disabled" selected>Destination in new tab</option>
<option >Open in new tab</option>
</select>
A click on the second option of both select boxes above should open a new window (first select box) or a new tab (second select box). And that's indeed what happens in IE, Firefox, Chrome and Opera (popup blockers enabled!). But not so with Safari. This browser does not recognize onchange=open_in_new_window(...) and onchange=open_in_new_tab(...) as explicit requests. In this particular case, it views the onchange as something that is forced upon the user and that, therefore, must be prevented to happen.

There may be other cases where things like this may happen (with Safari or with other browsers). So we must have a means to warn the user to disable his/her popup blocker in particular cases. The code is simple. We must simply verify whether or not the browser 'recognizes' or allows an event. In our example, Safari apparently does not recognize or allow window.open and window.open('','_new') (if blocking popups is enabled). We can use this information to modify the script given above as follows:
Code:
<script>
function open_in_new_window(url)
{
var wwidth=700;
var lleft=parseInt(screen.width/2)-parseInt(wwidth/2);
the_popup=window.open(url,"_blank","left="+lleft+",width="+wwidth+",height=400, top=100");

if (typeof(the_popup)=='undefined'){alert("Your browser tried to open:\n\n"+unescape(url)+"\n\nAlthough this is a safe file, your security settings prevented it from being opened in a new window. Please disable your pop-up blocker, reload the page, then click the link again."); }

}

function open_in_new_tab(url)
{

if (typeof(window.open('','_new'))=='undefined') {
alert("Your browser tried to open:\n\n"+unescape(url)+"\n\nAlthough this is a safe file, your security settings prevented it from being opened in a new tab. Please disable your pop-up blocker, reload the page, then click the link again."); }

window.open('','_new').location.replace(url)
}
</script>

DEMO AND EXPLANATIONS here (you must use Safari).

Arie

Submit "New windows, new tabs and popup blockers" to del.icio.us Submit "New windows, new tabs and popup blockers" to StumbleUpon Submit "New windows, new tabs and popup blockers" to Google Submit "New windows, new tabs and popup blockers" to Digg

Updated 12-07-2012 at 10:58 PM by molendijk

Tags: None Add / Edit Tags
Categories
Uncategorized

Comments

  1. traq's Avatar
    Quote Originally Posted by molendijk
    Sometimes, browsers / popup blockers make mistakes and block windows or tabs although they are explicitly requested by the user.
    I think the underlying problem is that it's impossible for the browser to tell what the user's intention really was. Browsers are forced to speculate on the basis of known behaviors (both legitimate uses and scams/dishonest uses).

    -------------------

    I wonder if you could use a confirmation dialog instead of an alert, and simply ask if the user wants to open the popup...? That ought to be considered an "explicit request," right? And it would avoid the need to fiddle with settings and reload the page.
  2. molendijk's Avatar
    Hello traq, thanks for the response.
    The general idea is that, as soon as we (as developers) know that a browser will refuse to perform a 'legal' action (such as opening a popup or a new tab after a click on a link), we write if (typeof(some_action)=='undefined'){alert("bla")}, where bla is the info needed by the user to make things (some_action) work 'as they should'.
    In our case, using a dialog box rather than an alert would only be an improvement if the dialog could be used to trigger some code that 'overrides' the browser's normal behavior i.e. that tells Safari, in this particular case, to abandon its normal behavior in favor of opening a popup or a new tab. But creating such code seems impossible, for reasos of security.
    I should add that there's no real need to anticipate on what the browser may do or refuse, since for every event we want to be accomplished we can add if (typeof(some_action)=='undefined'){alert("bla")} to our code. Most of the time, this line will be redundant (= no alert, because the action will not be classified as 'undefined' by the browser), but it never hurts.
    Arie.
  3. traq's Avatar
    Quote Originally Posted by molendijk
    if the dialog could be used to trigger some code that 'overrides' the browser's normal behavior i.e. that tells Safari, in this particular case, to abandon its normal behavior ... But creating such code seems impossible, for reasos of security.[sic]
    I hadn't checked if it was possible or not. I'd imagined it would be, but... ah well. c'est la vie.