Menu
Currently I'm using this small piece of js in my site to allow my div to act as a button:
<div id="item" onclick="location.href='http://www.google.com';" style="cursor:pointer;">Google</div>
But something I do very often when web browsing is opening a large amount of tabs. Is there any way I could modify my code to allow for this?
693
How to Open Hyperlinks in a New Browser Tab or Window. The short answer is: just add a target="_blank" attribute to your links (anchor tags). Now when your visitors click that link, it will open in a new window or tab (depending on which web browser they are using and how they configured that browser).
You can load any link in a new browser tab by clicking or tapping on it while holding down the Control key (Windows) or the Command key (Mac).
a target=”_blank” Open in New Browser Tab (or Window) The target attribute specifies where the linked document will open when the link is clicked. The default is the current window. If target="_blank" , the linked document will open in a new tab or (on older browsers) a new window.
This should do it:-
<html>
<head>
<style>
.sampleDiv
{
position:relative;
margin:0px auto;
width:400px;
height:200px;
background-color:#CCCCCC;
text-align:center;
}
.actualLink
{
position:absolute;
top:0px;
left:0px;
width:100%;
height:100%;
}
.linkText
{
position:relative;
top:80px;
}
</style>
</head>
<body>
<div class="sampleDiv">
<a class="linkText" href="test.html">testing</a>
<a class="actualLink" href="test.html"></a>
</div>
</body>
</html>
The link with class actualLink is covering whole of the div. The link with class linkText is providing the text. The purpose of using two tag is that if you only use actualLink then you cannot position the text wherever you want.By using the link with class linkText you have flexibility of centering(vertically) the text(horizontal centering can be done using only actualLink)
188
My solution was to replace the div blocks with anchor blocks. Anchor blocks can now take on the CSS styles of nearly anything a div can do, but it can also include href, which the browser will recognize and give you the right-click options you want to see.
So old:
<div class="divClass" onClick="location.href='http://www.google.com'">asdf</div>
becomes
<a class="divClass" href="http://www.google.com">asdf</a>
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With
