modern windowless popups

Question

Hello all,

I have seen for some time popups without window and it looks like a custom made png file as popup. many times there is a big close cross in the upper right corner.

Can someone tell me please how this is called and in what kind of code this is made?

Answer 1

You're almost certainly looking at some form of Lightbox. This page has an extensive list of implementations.

Answer 2

These are most easily created by javascript library plug-ins.

Prototype has LightBox

jQuery used to have ThickBox, but it is no longer maintained. Searching now for alternatives (the old page for ThickBox has several newer options)...

Answer 3

I've typically heard them called modal dialogs.

There's a jquery library called simplemodal. It's very easy to use.

Answer 4

It's usually an html div that is popped up through Javascript, usually through plugins for a Javascript framework such as jQuery. Here's a tutorial of using one of the plugins.

Answer 5

Hi, I don't know if people still call them DHTML pop-ups. Anyway, code for this kind of pop-up nowadays is usually very simple. The one I prefer is jQuery Tools. Here: http://flowplayer.org/tools/demos/overlay/apple.html

Answer 6

There's no built-in support, they're implemented using pure html, css, and javascript. The easiest way to do this is to use an existing javascript library like the jquery (see jquery's dialog box) or another solution to create javascript, like GWT (see Google Web Toolkit Dialog Box)

Answer 7

There are many ways to implement a pop over in JavaScript and most libraries now have built in support for such things, or have added support through plugins and mini-frameworks (lightbox). Here are just a few by their respective libraries, of which, jQuery and Prototype have the best out-of-the-box support and features.

jQuery

• $.dialog (jQuery UI, generic dialog)
• prettyPhoto (plugin, handles images, flash, youtube, Quicktime, external sites)
• jquery lightbox (plugin, handles images only)
• thickbox (plugin, lightbox alternative, handles images, frames, inline/ajax content)

Prototype/Scriptaculous

• lightview (mini-framework, handles Image, Flash, Quicktime, Ajax & Forms, Anti-aliasing, Iframe, Inline content)
• lightwindow (mini-framework, handles too many to list)
• lightbox 2 (mini-framework, handles images only)

Dojo

• dijit.Dialog (dijit built-in, generic dialog)

ExtJs

• MessageBox (built-in, generic dialogs)
• Ext.ux.DataView.LightBox (plugin, adhoc, alpha)

YUI

• YAHOO.widget.Dialog (built-in, generic)

Here's another list with more/different plugins.