Forum Moderators: open
<a href="http://www.domain.com" onclick="location.href='http://www.domain.com/?click=33224';return false;">domain.com</a>
but i want those links to open up in a new window. How do I do that?
Beware though, a lot of popup blockers will catch and disable window.open.
J.
You generally want to pass the click to a function (see below) so you can add extented coding:
onClick="newWindow('file.html');"
or pass parameters for a document.write once it gets there, such as just for an image:
onClick="newWindow('image.jpg','Image Title',500,250);"
To insure viewers will see your stuff regardless of whether or not Javascript is enabled, make the actual href to whatever you would open (file.html or image.jpg.) Normally this would cause the page to load the link in the href, but the return false; executes only IF Javascript is enabled, and this tells the browser NOT to follow the link.
<a href="file.html" onClick="newWindow('file.html');" return false;">Click me</a>
or
<a href="image.jpg" onClick="newWindow('image.jpg','Image Title',500,250);" return false;">Click me</a>
The window.open has many parameters, the most important of which are the window name, an object handle by which you reference the window, the url, and all of the size/toolbar parameters.
You can simply load an image or URL into the new window or dynamically write to it. The Date function below assigns a unique window name to the window so it always opens in a new one. If you use "My_window_name" for the name, every click will open in the same window.
For a simple URL:
<script type="text/javascript">
function newWindow(url) {
var day= new Date();
var id = day.getTime();
var win = open(url,id,'width=500,height=500,scrollbars,resizable');
}
</script>
The version below uses document.write to populate the window content, allowing a close button on the page without writing an html file for every image. It opens a new window based on the image size. (If you use large images, you'll have to test the browser for screen area so it all fits on the screen, it is SO ANNOYING for a window to pop up that's larger than your viewport.) Don't forget to close() or you'll get a blank window:
<script type="text/javascript">
function newWindow(img,title,w,h) {
var day= new Date();
var id = day.getTime();
var ww = w+75; // Make room for scrollbars
var wh = h+125; // and a close button
var params = 'width='+ww+',height='+wh+',scrollbars,resizable';
// Build the output and store it all in msg
var msg='<html><head><title>'+img+'</title></head><body><h3 aligh="center">'+
title+'</h3>\n<div align="center"><img src="'+img+'" width="'+w+'" height="'+h+'" border="0" alt="'+title+'"><br>\n'+
'<hr width="100%" size="1"><form><input type="button" onClick="javascript:window.close();" value="Close Window"><br>\n'+
'<hr width="100%" size="1"></form></div></body></html>\n';
// Write it all out
var win = open('',id,params);
win.document.write(msg);
win.document.close();
}
</script>
