Popup Window Functions

These functions are just for quick and easy popup windows, when you need to do things like display an external site in a new window, or show a photo enlargement in a small popup window. They should be called in the onclick attribute of an a or button element When used in an a element, you should put the URL in the href attribute and put "this.href" as the first argument of the function. You must also put "return false;" after the function to keep the current page in place. E.g.: <a href="example.html" onclick="popup(this.href); return false;">

FM.popup(url, width, height, windowName)

Displays a specified URL in a new window with menus, toolbars, addressbar, and scrollbars, for placing websites in a new window.

FM.popupNoTools(url, width, height, windowName)

Displays a specified URL in a new window with no menus or toolbars, but with scrollbars, for placing things like PDFs into new windows.

FM.popupNoScroll(url, width, height, windowName)

Displays a specified URL in a new window with no menus, toolbars or scrollbars, for placing things like photos in new windows.

Examples

This link to The Secular Web will popup in a new window with menus, toolbars, an address bar, and scrollbars—as if you had told your browser to give you a new browsing window.

This link to the "What Would Socrates Do?" bumper sticker PDF will popup in a new window with no menus or toolbars, but with scrollbars so that you can scroll around the PDF when zoomed in.

The photo thumbnail to the right will popup an enlargement when clicked. The enlargement window has no menus, toolbars or scrollbars, and is not resizable.

Code

You can copy and paste any and all of these functions, or just download them all in one file.

// Make sure the "FM" namespace object exists
if (typeof FM != 'object') {
    FM = new Object();
}

/**
 * Displays the specified URL in a new window with all menus, tools, and scrollbars
 *
 * @author  Dan Delaney     http://fluidmind.org/
 * @param   url             URL to display in the popup window
 * @param   width           (Optional) The width of the new popup window
 * @param   height          (Optional) The height of the new popup window
 * @param   windowName      (Optional) The name of the window
 */
FM.popup = function(url, width, height, windowName) {
    // Default to a 700 x 500 window
    width = (!isNaN(width) ? width + '' : '700');
    height = (!isNaN(height) ? height + '' : '500');
    windowName = (windowName == undefined || windowName == '' ? 'popup' : windowName);

    // Create it
    var popUp = window.open(url, windowName, 'width=' + width + ',height=' + height + ',scrollbars=yes,resizable=yes,menubar=yes,toolbar=yes,location=yes');

    // Bring it to the front
    if (typeof popUp == 'object') { popUp.focus(); }

}  // popup()


/**
 * Displays the specified URL in a new window with NO menus or tools, but with scrollbars
 *
 * @author  Dan Delaney     http://fluidmind.org/
 * @param   url             URL to display in the popup window
 * @param   width           (Optional) The width of the new popup window
 * @param   height          (Optional) The height of the new popup window
 * @param   windowName      (Optional) The name of the window
 */
FM.popupNoTools = function(url, width, height, windowName) {
    // Default to a 700 x 500 window
    width = (!isNaN(width) ? width + '' : '700');
    height = (!isNaN(height) ? height + '' : '500');
    windowName = (windowName == undefined || windowName == '' ? 'popup' : windowName);

    // Create it
    var popUp = window.open(url, windowName, 'width=' + width + ',height=' + height + ',scrollbars=yes,resizable=yes,menubar=no,toolbar=no,location=no');

    // Bring it to the front
    if (typeof popUp == 'object') { popUp.focus(); }

}  // popupNoTools()


/**
 * Displays the specified URL in a new window with NO menus, tools OR scrollbars
 *
 * @author  Dan Delaney     http://fluidmind.org/
 * @param   url             URL to display in the popup window
 * @param   width           (Optional) The width of the new popup window
 * @param   height          (Optional) The height of the new popup window
 * @param   windowName      (Optional) The name of the window
 */
FM.popupNoScroll = function(url, width, height, windowName) {
    // Default to a 700 x 500 window
    width = (!isNaN(width) ? width + '' : '700');
    height = (!isNaN(height) ? height + '' : '500');
    windowName = (windowName == undefined || windowName == '' ? 'popup' : windowName);

    // Create it
    var popUp = window.open(url, windowName, 'width=' + width + ',height=' + height + ',scrollbars=no,resizable=no,menubar=no,toolbar=no,location=no');

    // Bring it to the front
    if (typeof popUp == 'object') { popUp.focus(); }

}  // popupNoScroll()