abidibo.net

moopopup documentation

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

moopopup

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.

constructor

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.

display

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

myinstance.display()

setFocus

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

myinstance.setFocus()

close

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

myinstance.close()

Styling

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