如何在Html / css中打开新窗口中的链接(不在新选项卡中)

时间:2013-10-28 11:45:15

标签: javascript html css html5 css3

要在新标签页中打开链接,请执行以下操作:

<a href="#" target="_blank">open in new tab</a>

但是我如何在新窗口中打开它?

所以,帮我解决这个问题。

7 个答案:

答案 0 :(得分:1)

我认为你想在点击链接时打开一个全新的窗口。换句话说,你想要一个popup.try以下代码。

<script language="javascript" type="text/javascript">
function popitup(url) {
newwindow=window.open(url,'name','height=200,width=150');
if (window.focus) {newwindow.focus()}
return false;
   }

<a href="popupex.html" onclick="return popitup('popupex.html')">Link to popup</a>

答案 1 :(得分:1)

试试这个:

<a href="#nul" onclick="window.open('newLink.html ','','Toolbar=1,Location=0,Directories=0,Status=0,Menubar=0,Scrollbars=0,Resizable=0,Width=550,Height=400');">Name</A>

答案 2 :(得分:0)

<script>
function openWin()
{
myWindow=window.open('','','width=200,height=100');
myWindow.document.write("<p>This is 'myWindow'</p>");
myWindow.focus();
}
</script>

请参阅here

以上的内容

答案 3 :(得分:0)

如果您在拨打window.open时指定宽度和高度,大多数浏览器都会在新窗口而不是标签中打开链接。

window.open(url, '_blank', 'width=500,height=400');

Live Demo

答案 4 :(得分:0)

这在理论上有效,但它取决于浏览器中设置的首选项。现在有一天你可以使用div和Layers伪造一个新窗口。无论如何都要实现一个隐藏它背后的东西的层。

JavaScript的:

function getElementsByClass( searchClass, domNode, tagName) { 
    if (domNode == null) domNode = document;
    if (tagName == null) tagName = '*';
    var el = new Array();
    var tags = domNode.getElementsByTagName(tagName);
    var tcl = " "+searchClass+" ";
    for(i=0,j=0; i<tags.length; i++) { 
    var test = " " + tags[i].className + " ";
    if (test.indexOf(tcl) != -1) 
        el[j++] = tags[i];
} 
return el;
}
// paste getElementsByClass function (see above) here 

function showtab(tabname) 
{ 
// hide every element with class 'box1'  
var tabs = getElementsByClass('box1');
for(i=0; i<tabs.length; i++) {
    tabs[i].style.display = 'none';
    //tabs[i].style.visibility = 'hidden';
}
// hide every element with class 'box1'      
var tabs2 = getElementsByClass('myStyle');
for(i=0; i<tabs2.length; i++) {
    tabs2[i].style.display = 'none';
    //tabs2[i].style.visibility = 'hidden';
}

document.getElementById(tabname).style.display='block';
//document.getElementById(tabname).style.visibility='visible';
// show element with given tabname 
} 

function showsubtab(tabname)
{
//hide every element with class 'myStyle'
var tabs = getElementsByClass('myStyle');
for(i=0; i<tabs.length; i++) {
    tabs[i].style.display = 'none';
    //tabs[i].style.visibility = 'hidden';
}
document.getElementById(tabname).style.display='block';
//document.getElementById(tabname).style.visibility='visible';
}

if (window.addEventListener) { // Mozilla, Netscape, Firefox
window.addEventListener('load', showmessage, false);
} else if (window.attachEvent) { // IE
window.attachEvent('onload', showmessage);
}

function showmessage() {
document.getElementById('box').style.display='block';
document.getElementById('div1').style.backgroundColor='grey';
document.getElementById('div1').style.opacity = 0.2;
document.documentElement.style.overflow = "hidden"; //firefox, chrome
document.body.scroll = "no"; // ie only
var bodyLayer = document.getElementById('div1');
DisableLinks(bodyLayer);
}
function hidemessage() {
document.getElementById('box').style.display='none';
document.getElementById('div1').style.backgroundColor='transparent';
document.getElementById('div1').style.opacity = 1.0;
document.documentElement.style.overflow = 'auto';  // firefox, chrome
    document.body.scroll = "yes"; // ie only
var bodyLayer = document.getElementById('div1');
EnableLinks(bodyLayer);
}

function DisableLinks(dom) {
if(undefined != dom){
    links=dom.getElementsByTagName('A');
} else {
    links=document.getElementsByTagName('A');
}

for(var i=0; i<links.length; i++) {
    links[i].style.pointerEvents="none";
}
}

function EnableLinks(dom) {
if(undefined != dom){
    links=dom.getElementsByTagName('A');
} else {
    links=document.getElementsByTagName('A');
}

for(var i=0; i<links.length; i++) {
    links[i].style.pointerEvents="auto";
}
}

<强> HTML

<div id="box">
<section id="close">
<section id="title">Important Site Message</section>
<section id="button"><a href="#" onClick="hidemessage();">[X]</a>&nbsp;</section>
</section>
<!--Body of the Message-->
</div>

CSS     #box {position:absolute;最高:50%;左:50%;身高:15.625em;宽度:25em;背景色:#FFF; margin-top:-7.8125em; margin-left:-12.5em; display:none;溢出:自动;边框颜色:#000;边框样式:脊;边框宽度:介质; z-index:3;颜色:#000;}     #close {border-bottom:inset thick #CCC;背景色:#000;宽度:继承;身高:1.2em;颜色:#FFF;位置:固定;}     #close a:visited {color:#FFF;}     #close a:hover {color:red;文字修饰:无;}     #close #title {text-align:center;字体重量:粗体;宽度:90%;填充:1 1 1 1;清楚:左;向左飘浮;背景色:#000;颜色:#FFF;}     #close #button {text-align:right;填充:1 1 1 1;宽度:10%;明确:对;漂浮:对;背景色:#000;颜色:#FFF;}

答案 5 :(得分:0)

使用以下代码 mywindow的= window.open( 'https://www.google.co.in/', '', '宽度= 500,高度= 500');

答案 6 :(得分:-2)

  

在“a”标记内使用target="_blank"