jQuery Cleanly Open Links in Popup Windows

By Sam Deering April 06, 2011

Simple jQuery code snippet to add an event to all links with class .popup to open in a popup window instead of the current page or new tab/window. Specify the heights and widths as you please.

jQuery(document).ready(function($) {
	jQuery('a.popup').live('click', function(){
		newwindow=window.open($(this).attr('href'),'','height=200,width=150');
		if (window.focus) {newwindow.focus()}
		return false;
	});
});

jquery open links in popup window, jquery popup window

Meet the author

Sam Deering

Sam Deering is a Front-end Web Developer who specialises in JavaScript & jQuery. Sam is driven and passionate about sharing his knowledge to educate others.

http://kyoucode.com Austin

Hi jquery4u,

I found this script quite lightweight and useful. I was wondering if there was a way to not only open the link in the popup, but also center the popup? If not center, otherwise position the popup?

Any help would be greatly appreciated.
jquery4u

Hi Austin,

Because window.open is a built in JavaScript method it doesn’t have positioning available (that i am aware).

As you say this script is very lightweight so if you wanted more options for popup windows have a look here:

http://www.jquery4u.com/jquery-windows-and-overlays/10-jquery-windows-overlays/
Razvan

Yes, it does open the link in a new pop-up window, but it also opens it in the current page (link’s page). :( Why?
Gurumoorthi S

http://phponwebsites.com is my blog. I want to create a link which is go to 2 link. one is opened in self and another is opened in new window. I done it. But i want the existing window with focus instead new window. My code is not working in firefox and chrome. Can you solve my proplem
http://w3responsive.com/ Javed Ur Rehman

This piece of code is very helpful for me :) thanks Sam Deering great work.
- http://jquery4u.com/ jQuery4u
  
  Your very welcome :)