Clever Geek Handbook

How to open a new window when clicking on a hyperlink?

I would like to open a new window with a height of 600px and a width of 200px after clicking on the hyperlink.

How can I do this in HTML / Javascript?

Am I using something like window.open? Is it IE compatible? Or should I be using something in JQuery?

Thanks in advance.

+2


source to share


6 answers


It is much better to bind this to a hyperlink unobtrusively, like:

Html

<a href="mypopup.htm" id="popup">This will open in a new window</a>


JavaScript

window.onload = function() {
    document.getElementById("popup").onclick = function(){
        return !window.open(this.href, "pop", "width=200,height=600");
    }
}

The advantage of this approach is that you need to specify a hyperlink in your HTML file, and if JavaScript is disabled or generates an error for some reason, it will refuse to use the standard hyperlink.

+7


source


Creating a new window with JavaScript (including window size)
http://www.fontstuff.com/frontpage/fptut06.htm



+2


source


JavaScript is the best way to do it

var win = window.open (don't remember this bit); win.resizeTo (w, h); win.focus ();

0


source


window.open (URL, windowName [, windowFeatures])

More information here

0


source 


winRef = window.open( URL, name [ , features [, replace ] ] )

Source: http://www.javascripter.net/faq/openinga.htm

0


source 


var user_window=window.open('http://www.someplace.com','someplace_window_name','toolbar=no,directories=no,location=no,status=yes,menubar=no,resizable=yes,scrollbars=yes,width=1024,height=768');
user_window.focus();

The user click must initiate this, or it will be blocked by most pop-up blockers. This works in all browsers I have had to support, including IE6 +, FF, Opera, Safari.

The focus bit ensures that the new window is brought to the front.

As an alternative to the popup, I suggest the Dialog plugin for JQuery.
This is what I replaced 90% of my popups.
Your popup becomes popover (linked in the original window) and this is never blocked by the popover blocker as far as I can tell. The Dialog plugin lets you drag popovers, look and feel, and a lot of other cool stuff.

0


source






More articles:


All Articles