1. Home
  2. Computing & Technology
  3. JavaScript
photo of Stephen Chapman
Stephen's JavaScript Blog

By Stephen Chapman, About.com Guide to JavaScript since 2004

Modal Dialog Box

Saturday October 4, 2008
Build your own in page modal dialog boxes using HTML

One thing that has always been difficult to achieve for web pages is the addition of modal dialog boxes (that don't allow further interaction with the page until there is a response to the dialog). Web browsers only provide alert, confirm, and prompt for JavaScript code to call when you want to interact modally with your visitors. Only Internet Explorer provides anything beyond this with a custom function for opening a modal window.
JavaScript works best when interacting within the web page itself and so the ideal solution to the problem of being able to create your own custom dialog boxes that contain what you want them to contain is to somehow create the modal dialog box within the page itself but the problem then is how do you stop your visitors from interacting with the rest of the page while you have the modal dialog displayed. Well with this modal dialog box script those problems are easily resolved to give a cross browser in page modal dialog box containing whatever you want it to contain since you code the content yourself with HTML.
Comments
October 9, 2008 at 2:36 pm
(1) john-hans says:

I always try your javascripts….but it seems you drop the ball when you get to the actual using of them. Please…just tell me what to do without going on tangents. the modal box…third part left me quizical….and wondering. Just let me test a page….tell me how to test a page….THEN tell me options. I’m a novice that can follow steps but not strays. John-hans

Leave a Comment

Line and paragraph breaks are automatic. Some HTML allowed: <a href="" title="">, <b>, <i>, <strike>

Explore JavaScript
About.com Special Features

Stay connected and entertained with reviews on tips on the latest HDTVs, cellphones and more. More >

Easy ways to connect two computers for networking purposes. More >

  1. Home
  2. Computing & Technology
  3. JavaScript

©2009 About.com, a part of The New York Times Company.

All rights reserved.