JavaScript is disabled!

popLink

popLink( props );

This jQuery plugin adds a popLink() method that makes matching links open in popups. Default properties can be overridden, making all kinds of popups possible.

Returns

jQuery object

Arguments

props [ Object | optional ]
Key/value pairs of properties that differ from default.
The default properties are as followed, but may be altered for the whole project:

{
    target: "_blank",     // (String)  Target name of popup
    blank: false,         // (Boolean) Blank window: true > no properties are applied / false > properties are applied 
    width: 500,           // (Integer) Width popup window
    height: 550,          // (Integer) Height popup window
    absH: false,          // (Boolean) Horizontal positioning: true > absolute / false > center
    absV: false,          // (Boolean) Vertical positioning: true > absolute / false > center
    popH: 640,            // (Integer) Horizontal position. If absHor is false, this value will be used as minimal screen width in case the available screen width is unknown
    popV: 480,            // (Integer) vertical position. If absVert is false, this value will be used as minimal screen height in case the available screen height is unknown
    print: false,         // (Boolean) Print version. If true, the toolbar will be shown in case the browser does not support window.print
    props: ["resizable"], // (Array)   Array with, comma seperated, window propertie names (String) which must be 'on'. E.g. ['location','scrollbars']
    keepRef: false,       // (Boolean) Keep reference to popup window. If true a reference will be kept in $.data("ref") stored on the link
    className: "jsPopup", // (String)  Class name set on popup link
    replaceLoc: false     // (Boolean) Replace popup location in browser's history or not
}

DOM alterations

This method adds the following hooks:

  • on link (default className can be overridden using 'props' argument as well):
    .jsPopup

The "jsPopup" className can be used to distinguish popup links from normal links.

Examples

<ul class="external">
    <li><a href="http://www.google.com/chrome/">Chrome</a>
    <li><a href="http://www.mozilla-europe.org/nl/firefox/">Firefox</a>
    <li><a href="http://www.microsoft.com/windows/internet-explorer/">Internet Explorer</a>
    <li><a href="http://www.opera.com/browser/">Opera</a>
    <li><a href="http://www.apple.com/safari/">Safari</a>
</ul>

Here $(".external a").popLink(); will make all the links in the list open in a popup, using the default properties. When we want a popup with different dimensions we could override these like this: $(.external a").popLink({width:200, height:250});.

Downloads

jquery.poplink-0.1.8.js (3.51kB)

Versions