1

Please read my rational before downvoting.

I’m building a little web educational project where there is a section of art. Upon clicking a button, an element that contains a picture with an art piece will be showed. After that, I want another window to be opened with another website that has further or relevant information about the specific art piece(wikipedia, museums sites, virtual galleries, etc). I know that I could put another button to the link to the other website so that the user could click by themselves after looking at the art piece, but I would really like to achieve that feel of dynamicity and also put the user’s eyes on that relevant site after they’ve seen the art piece. Here is my code:

jQuery('a.artpiece').click(function(){
        $(".photoContainer").show();

  setTimeout(function() {
    window.open("http://www.anotherartwebsite.com");
  }, 6000);

});

Unfortunately the popup blocker is triggered since as you know the browser doesn´t take the window.open function as a direct result of the user’s action since it is delayed a few seconds. I have gone through a bunch of posts here where a workaround is made using Ajax to avoid the popup blocker, but since in this case I’m not using Ajax, I’m not sure if they would serve my purpose. Thanks in advance.

Arturo Rosales Baez
  • 159
  • 1
  • 13

2 Answers2

1

Instead of opening up a new window, open a modal. Within the modal, add an iframe pointing to the wikipedia url. As a result your modal will display the content of the article.

As you already use jQuery, you'll find plenty of modal widgets out there. The following one seems a good fit: http://jquerymodal.com

roland
  • 7,695
  • 6
  • 46
  • 61
  • 1
    That is correct. Even better, if you do not want to use ` – Terry Jun 10 '17 at 17:09
  • Thanks, for simplicity I just stated wikipedia on the question, but actually there will be another sites that have relevant or further information about the art piece. They might be, museum sites, virtual galleries etc, that wouldn't work properly or might have locks to iframes. I think opening the other tab is crucial. Just edited the question. Thanks – Arturo Rosales Baez Jun 10 '17 at 17:16
  • 1
    There is a solution. See jayphelps's answer: https://stackoverflow.com/questions/9514698/bypass-popup-blocker-on-window-open-when-jquery-event-preventdefault-is-set. Basically, create a blank window, set its url after some time and trigger it. – roland Jun 10 '17 at 19:17
1

I understand that your intention is not to use popup windows for evil, but enough people do use it for evil that even the good people are affected by the popup blockers. This is why we can't have nice things.

I have gone through a bunch of posts here where a workaround is made using Ajax to avoid the popup blocker

I believe you're referring to this answer? If so, that wouldn't work for your purposes -- there the asker wanted to wait for the results of a JSON call before opening the popup window, so the solution was to make that call synchronous so that its return would wind up being treated as part of the same click event.

That doesn't fit your situation, since what you want is a relatively long delay -- you could theoretically make a no-op synchronous ajax call and have the server deliberately delay the response for a while (and hope that the browser doesn't time out in the meantime)... but meanwhile the user's browser UI would be completely locked up while it waits for that response. That's not good (and is the reason synchronous ajax is deprecated; I believe some browsers already throw errors if you attempt it, and they all will sooner or later.)

So that's out.

Your choices, therefore, are

  1. delay, and then automatically pull the Wikipedia article into an inline iframe instead of a secondary window
  2. Have the user proactively click a button to pop the wikipedia article instead of loading it automatically.

Here I'm going to lapse into treating this as though it were a ux.stackexchange question, apologies in advance: I would strongly urge you to consider option 2 instead of 1. Personally I hate it when websites throw unexpected content in my face for no apparent reason, which is exactly what the user experience here would be. ("I was looking at the art! Now there's a wikipedia article in my face! Who asked for that?")

You could defer the display of that "click here for more information" button for a few seconds to give the user a chance to appreciate the art first. But just dropping that info on them whether they want it or not is what I'd consider user-hostile behavior (whether it's in a popup window or inside the main one.)

Daniel Beck
  • 20,653
  • 5
  • 38
  • 53