Modal windows with Javascript and CSS

One of the side projects I spent a little time on today was researching the use of on-page modal dialog boxes using Javascript and CSS that shade or darken the rest of the page while they are open. It looks like it will be an easy job thanks to these two solutions that are made freely available:

I’m leaning towards subModal right now since Lightbox uses prototype.js which adds 48K to the first page view. We serve around 150,000 unique visitors per day so adding prototype would result in an additional 150 * 48K = 7GB of bandwidth usage per day (we’re not currently running mod_gzip).

Update: here are some other solutions including a draggable one, DHTML Window (draggable but no shading), draggable with shading or fixed position, and Popup Window 4.5

Related reading: Popups with a twist, Sublog: author of subModal’s blog, and Inline popups

One Response to “Modal windows with Javascript and CSS”

  1. BlairDee.info » In-Page Modal Windows (grays out the background) Says:

    [...] well heres an interestign blog post about how to create them:http://gabrito.com/post/modal-dialog-box-solutions-with-javascript-and-css [...]

Leave a Reply