How do I make a div link open in a new tab Javascript onClick="window.location

Question

I created a range of social media buttons which when the mouse hovers it switches to a different image (giving it a highlight effect). The images work as I want them to, however, I can't seem to figure out how to load the page into a new tab/screen. I need to implement the equivalent of .

Assuming I have to change something in the onClick.... ?

Here is code:

<div id="insidefooter">
<ul>
    <li>
        <div id="facebook" style="cursor:pointer;" onClick="window.location='https://www.facebook.com';"></div>
    </li>
    <li>
        <div id="youtube" style="cursor:pointer;" onClick="window.location='https://www.youtube.com';"></div>
    </li>
    <li>
        <div id="twitter" style="cursor:pointer;" onClick="window.location='https://twitter.com/';"></div>
    </li>
</ul>
</div>

Here is CSS:

#facebook {
height: 40px;
position: relative;
top: 0px;
left: 260px;
width: 40px;
background-image:url(/img/index/footer/facebook-button.jpg);
}

#facebook:hover {
height: 40px;
width: 40px;
background-image:url(/img/index/footer/facebook-button2.jpg);
top: 0;
left: 260px;
width: 40px;
position: relative;
}

#youtube {
height: 40px;
position: relative;
top: -62px;
left: 360px;
width: 40px;
background-image:url(/img/index/footer/youtube-button.jpg);
}

#youtube:hover {
height: 40px;
width: 40px;
background-image:url(/img/index/footer/youtube-button2.jpg);
top: -62px;
left: 360px;
width: 40px;
position: relative;

I left out some CSS code to make it simpler, but here is a demo http://fiddle.jshell.net/3Bsyd/2/

Thank you!

`window.open();` ? If you don't define the height and width it will open in a new tab. — iamsleepy, Apr 04 '14 at 07:47
you can find here duplicate..http://stackoverflow.com/questions/12529837/using-a-div-as-a-link-option-to-open-new-tab — rk rk, Apr 04 '14 at 07:56

score 43 · Accepted Answer · edited Aug 21 '19 at 07:44

43

onclick="window.open('http://google.pl', '_blank');"

edited Aug 21 '19 at 07:44

Bhargav Rao

50,140
28
121
140

answered Apr 04 '14 at 07:51

I am looking for the right click option that I need the user to decide whether opens the link in new tab or in current tab. Same as pressing `Ctrl` + Click can open in new tab while clicking opens the page in current tab. – Mai Feb 27 '15 at 07:59

score 2 · Answer 2 · answered Apr 04 '14 at 07:52

2

<div id="facebook" style="cursor:pointer;" onClick="window.open('http://www.google.com','_newtab');">Test</div>

answered Apr 04 '14 at 07:52

Santhosh Kumar Vijayarangan

247
1
9

Thank you for your answer. What's the difference between _newtab and _blank? – ben_dchost Apr 04 '14 at 08:04
Both do same operation _blank is advisable – Santhosh Kumar Vijayarangan Apr 04 '14 at 08:13
whats the difference? @ ben_dchost – Santhosh Kumar Vijayarangan Apr 04 '14 at 08:30

How do I make a div link open in a new tab Javascript onClick="window.location

2 Answers2

Linked