【问题标题】:How do I make a div link open in a new tab Javascript onClick="window.location如何在新选项卡中打开 div 链接 Javascript onClick="window.location
【发布时间】:2014-04-04 07:45:43
【问题描述】:

我创建了一系列社交媒体按钮,当鼠标悬停时它会切换到不同的图像(给它一个高亮效果)。这些图像可以按我的意愿工作,但是,我似乎无法弄清楚如何将页面加载到新的选项卡/屏幕中。我需要实现 .

假设我必须更改 onClick.... 中的某些内容?

代码如下:

<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>

这里是 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;

我省略了一些 CSS 代码以使其更简单,但这里有一个演示 http://fiddle.jshell.net/3Bsyd/2/

谢谢!

【问题讨论】:

  • window.open(); ?如果您不定义高度和宽度,它将在新选项卡中打开。
  • 你可以在这里找到重复的..stackoverflow.com/questions/12529837/…
  • @rkrk 谢谢,抱歉一定错过了问题。

标签: javascript html css


【解决方案1】:

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

【讨论】:

  • 我正在寻找右键单击选项,我需要用户决定是在新选项卡还是在当前选项卡中打开链接。与按Ctrl 相同 + 单击可以在新选项卡中打开,同时单击在当前选项卡中打开页面。
【解决方案2】:

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

【讨论】:

  • 感谢您的回答。 _newtab 和 _blank 有什么区别?
  • 两者都做同样的操作 _blank 是可取的
  • 有什么区别? @ben_dhost
猜你喜欢
  • 1970-01-01
  • 2015-03-08
  • 2017-01-05
  • 2012-04-25
  • 1970-01-01
  • 2017-11-18
  • 1970-01-01
  • 2013-07-16
  • 2021-04-14
相关资源
最近更新 更多