0

Trying different options like I have page opened in new window below opens in newtab

 <a href="imageurl" target="_blank">
        <img src="imageurl" style="width: 50%; height: 220px;">
  </a>

Below overrides the current window

<img src="imageurl" style="width: 50%; height: 220px;" onclick="window.open(this.src)">

Looking to open in new window again. Please suggest

Swati
  • 28,069
  • 4
  • 21
  • 41
Nagappa L M
  • 1,452
  • 4
  • 20
  • 33

2 Answers2

7

To trigger a new window instead of a new tab (something you should generally be reluctant to do) you need to specify some window features which the browser won't apply to a tab.

Setting resizable is sufficient in Chrome. I haven't tested in other browsers.

HTML:

<a href="http://placekitten.com/100/100" target="_blank">
  <img src="http://placekitten.com/100/100">
</a>

JS:

const openInNewWindow = event => {
  event.preventDefault();
  const {href, target} = event.currentTarget;
  const features = "resizable";
  window.open(href, target, features);
};


document.querySelector("a")
  .addEventListener("click", openInNewWindow);

(Don't bind click event listeners to images, they aren't designed as interactive controls. Users who depend on (for example) a screen reader or a keyboard focus to interact with a document will find it difficult or impossible to trigger a click on an image. Use semantic markup. If you are linking something, use a link, then enhance with JS.)

Quentin
  • 914,110
  • 126
  • 1,211
  • 1,335
  • Thanks for the help.This is how i have tested but still opens in tab and we are expecting popup window html – Nagappa L M Nov 10 '20 at 09:19
  • Well `teststst` will match any `` elements in your HTML document and you shouldn't have any of those … so why do you have that? – Quentin Nov 10 '20 at 09:20
  • Can i add onclick js function from anchor tag.. ? please tell what to add in called function..I have tried by putting document.querySelector("a"),still opens in tab.. – Nagappa L M Nov 10 '20 at 09:24
  • tried window.location.replace('url') this overrides the current window too...Onclick one more pop up window should open with the image showing.. – Nagappa L M Nov 10 '20 at 09:32
  • I'm lost. Why are you looking at location.replace? My answer doesn't mention it (for good reason!). Just do what I said in the answer. – Quentin Nov 10 '20 at 09:38
  • Yes tested from the answer this opens in tab not a popup window – Nagappa L M Nov 11 '20 at 07:22
  • It's a new window when I test it: https://i.postimg.cc/13jF1jKb/2020-11-11-08-53-57.gif – Quentin Nov 11 '20 at 09:01
  • Thanks Quentin. I was putted java script beginning of body tag thats why element was not detecting..it worked.Thanks lot :-) – Nagappa L M Nov 11 '20 at 11:21
-1

Try like

window.open(this.src,"_blank");
avtar singh
  • 22
  • 2