moopopup documentation

Welcome to the moopopup documentation page (last available version). For a quick start guide, take a look at the demo page.


This is the class that has to be instantiated in order to get a moopopup object and show the desired content. Let's see the public and useful methods.


Constructs a moopopup instance. The syntax is:

var myinstance = new moopopup(options)

The available options are:

  • id: (string) default 'moopopup'. The css identifier of the window.
  • title: (string) default null. The window title.
  • width: (int) default 400. The window width.
  • height: (int) default null. The window height. If null the height follows the content.
  • top_left_x: (int) default null. The x coordinate in px of the top left corner of the window. If null the window is horizontally centred in the viewport.
  • top_left_y: (int) deafult null. The y coordinate in px of the top left corner of the window. If null the window is vertically centred.
  • min_width: (int) default 300. The minimum window width allowed when resizing.
  • min_height: (int) default 100. The minimum window height allowed when resizing.
  • max_body_height: (int) default null. The maximum height allowed for the window content.
  • draggable: (bool) default true. Whether to make the window draggable or not.
  • resizable: (bool) default true. Whether to make the window resizable or not.
  • overlay: (bool) default true. Whether to show the window over an opaque layer (lightbox rulez).
  • overlay_click_close_window: (bool) defaul true. Whether to activate the event listener which causes the window to be closed when clicking outside it and over the overlay or not.
  • url: (string) default null. The url called through ajax request to get the window content.
  • text: (string) default null. The text to use as window content.
  • html_node: (mixed) default null. The element or its id of the html node from which get (clone) the window content.
  • disable_objects: (bool) default true. Whether to disable active objects before showing the window (flash players for example may stay over the window if not set to true). 
  • onComplete: (function) default function(){}. The function called when the window is fully displayed
  • onClose: (function) default function(){}. The function called when the window is closed.


Actually shows the window using the options set in the constructor.



Set focus to the window, actually brings it to front.



Closes the window. Also calls a callback function if set through options.



When creating a moopopup instance the container element of the window receive the id attribute set through the id option. This allows to control every aspect of every window independently. The plugin comes with a base css which simulates the aspect of ubuntu 11.10 (gnome) windows.

project page demo download