Open New Browser Window with j. Query (Custom Size) « code. Belt. Posted by robert | Filed under j. Query. I sure this is nothing special but I thought I would share.
I’ve been play around with j. Query and wanted to build an easy way to open a new browser window with a certain size for multiple links. Below is what I came up with.
Click on the links below to see a simple demo. Update : I have added a new and improved version at the end of this article. Everything Together.
@Cyborg the second form (without JS) is the recommended one: a plain link suggesting a new tab/window. The first example (with JS onclick) should only be used when.
First take a look at what the whole thing and later I will break it out. Size. Array = [ "width=2. Window'). click(function (event){. Name = "pop. Up"; //$(this). Size = window. Size.
![A Href Open Link New Window A Href Open Link New Window](http://dmcritchie.mvps.org/icons/ff_optionstab.jpg)
Value Type Description; URL: String: Specifies the URL of the link. Possible values: An absolute URL - points to another web site (like location.href="http://www. Open New Browser Window with jQuery (Custom Size) Posted by robert | Filed under jQuery. I sure this is nothing special but I thought I would share.
Array[$(this). attr("rel")]. Name, window. Size). Default(). }). }).
![A Href Open Link New Window A Href Open Link New Window](http://3.bp.blogspot.com/-xn-8p4d5SYI/UB6BePXROCI/AAAAAAAAAiI/TfH4c3LkThY/s1600/new+tab.jpg)
Window" > click me< /a>. Window" > click me< /a>.
Add the HTML Links. Lets start with our links in the of our html. Notice I used the “rel” attribute to determine the array slot I would like to use. I will be using an array to hold on the link information.
Window" > click me< /a>. Window" > click me< /a>. Include the j. Query Java. Script library. < script type="text/javascript" src="http: //ajax. Include the j. Query Script.
Place this script below the include of the j. Query library. Below I explain what each line does. Size. Array = [ "width=2.
Window'). click(function (event){. Name = "pop. Up"; //$(this). Size = window. Size. Array[ $(this). attr("rel") ].
Name, window. Size). Default(). < /script>.
The j. Query Script Explained. Created an array to hold onto the desired info. Size. Array = [ "width=2.
Links that has the ". Window" class will call this script.
Window'). click(function (event){. Gets the URL from the clicked link. Gets the name from the clicked link.
Currently I commented out the. Up" for a default name because I didn't. Name = "pop. Up"; //$(this). Places the string from the array into the window. Size variable. The array slot is determined by the "rel" number on the link.*/.
Size = window. Size. Array[ $(this). attr("rel") ]. This method opens a new browser window. Name, window. Size). Prevents the browser from executing the default action and. Default(). < /script>.
New and Improved Version. Below I use the data attributes to set the size of the popup window. This way is more dynamic because you do not need to have extra logic in the Java. Script. < title> < /title>. Window'). click(function (event) {. Default(). var $this = $(this). Name = "pop. Up".
Size = $this. data("popup"). Name, window. Size). Window" data- popup="width=2. Window" data- popup="width=3. Comments (4. 6) |.
August 2. 8th, 2.