Download modal message script

Demo

Download files

You can download the entire script from this Zip file.

Files included in the package:

• demo-modal-message.html = Demo file
• js/modal-message.js = Main Javascript file
• js/ajax.js = Ajax (Library from http://twilightuniverse.com/projects/sack)
• js/ajax-dynamic-content.js = JS file from the Ajax dynamic content script.
• css/demos.css = CSS file the demos
• css/modal-message.css = CSS file needed in the script

Configuration

This script displays a modal message at the center of your browser window. When this message is displayed, all the other controls on your page will be disabled.

This is how it works:

Create object of class DHTML_modalMessage

messageObj = new DHTML_modalMessage(); // We only create one object of this class

Now, you can use some other methods to specify what to show and the appearance of the dialog box. These are some of the important methods:

setSource()

Specify path to external file. The content of this external file will be displayed inside the box. Argument to this method is:

1. relative path to file(String)

Example: messageObj.setSource("include/myMessage.html");

setHtmlContent()

Specify static HTML content. Argument to this file is:

1. HTML content(String)

Example: messageObj.setHtmlContent("This is <B>My</B> message");

setSize()

Sets the size of the message box. Arguments to method are:

1. width(int) - Width of box
2. height(int) - Height of box

Example: messageObj.setSize(500,300);

display()

Displays the message box. This method makes the message box appear on the screen. This method doesn't take any arguments.

close()

Hides the message box. This method removes a message box appear from the screen. This method doesn't take any arguments.

There are also some other methods you can use. Look at the comments above the method in modal-message.js for information about these

Comments

1 2 3 4 5

Hello. Im from quebec, in canada. I use many times many scripts from this site. Very cool. Very cool this site. Then, i use this script for many years. I use it under our CMS, with over 35 micro-applications. Then, is it possible to show informations about the programmer, to contact him, and get a customized version of this script?

Thanks for your good job.

Sebastien Julien

Solution Media Canada

Sebastien Julien at 08:52PM, 2011/03/11.

Admin comment

1 2 3 4 5

Sebastian,Almost all scripts are created in-house. By sending a message to post[at]dhtmlgoodies.com, you will get in touch with the author.

DHTMLGoodies at 10:38AM, 2011/03/14.

1 2 3 4 5

Your initial example in demo-modal-message-1.inc uses Javascript to set the focus to the first field.However the Javascript only works for the FIRST time you pop-up the dialog box and not for any subsequent time.What is going wrong? I have a modal box I made that heavily uses javascript and it works the first time but not any subsequent times.Thanks for your examples, I have used a few things from this website and I think it is great.

CSchwarz at 04:20AM, 2011/03/21.

1 2 3 4 5

What a great place for free scripts!

WebDesignMad at 04:04PM, 2011/03/22.

1 2 3 4 5

Hello,Since i've installed Internet Explorer 9, my modal windows don't works.Have got a solution to resolve that bug ?I don't like IE but i'm obligate to verify compatibility with other navigator.With FireFox and Google Chrome, it's all right.

Thomas at 06:22PM, 2011/03/31.

1 2 3 4 5

I also have problems with IE9, it does not show.Only with compat. mode on..Any solutions?

Geert-Jan at 04:36PM, 2011/04/04.

Admin comment

1 2 3 4 5

The script has been updated with a fix for IE9

DHTMLGoodies at 02:06PM, 2011/04/06.

1 2 3 4 5

Hello ,i really like your script but unfortunately I'm stuck in a problem here. How i could add scroll if the height is bigger than my screen?Any help will be appreciated , thank you

Teodor at 09:33AM, 2011/04/10.

1 2 3 4 5

HiI downloaded and when I tried the demo, for below examples, it didn't worked Message from url (example 1)Message from url (example 2)Alternative confirm dialog (example 3)Is this demo require to execute in server or can be executed in any static location.Thanks in advance.

Pramod at 12:47PM, 2011/04/20.

1 2 3 4 5

I see the note says it is fixed in IE 9, however I pulled the newest modal-message.js and it does not seem to be working. Can someone confirm that the download currently available on this page works on IE 9 official release?Thanks,Matt

matt at 12:46PM, 2011/04/29.

Admin comment

1 2 3 4 5

Matt,I've just rechecked. The zip file contains the latest modal-message.js file. Please clear your cache and try to download the file again.line 160 in the new modal-message.js file should look like this:this.iframe = document.createElement('IFRAME');

DHTMLGoodies at 12:57PM, 2011/04/29.

1 2 3 4 5

I apologize - the new code DOES work in IE 9.0 Thanks a lot for a great tool!Matt

matt at 05:44PM, 2011/04/29.

1 2 3 4 5

When using commercial sites, What license?

DongJoo at 07:17AM, 2011/05/30.

1 2 3 4 5

I thought it was failing for me too (in IE8), but then noticed I had zoomed into 105% view. At this level or above, the background goes solid grey with (for my site) a few random menu items being all that is visible from below. Correcting to 100% or less fixes this issue. Not important to me but thought you may wish to know. Bizarrely, although it works fine at any zoom in FF4, resetting to normal retains a thicker border round the popup. Thanks for a great piece of work,Calum

Calum at 12:30PM, 2011/06/01.

1 2 3 4 5

Ignore my border issue; I'd edited the border thickness at some point in the past and the new files had reset that to default 3px.

Calum at 12:43PM, 2011/06/01.

1 2 3 4 5

I am getting error while using modal-message.jsin IE 9Text :DOM Exception:INVALID_CHARACTER_ERR(5)ThanksSapan

Sapan at 06:03AM, 2011/07/01.

1 2 3 4 5

Trying to use this script, but all I get is "loading content, please wait" message. My call is "displayMessage("include/mentor-message.inc");" I double-checked my include file and it is named correctly and in the correct folder (include). Any ideas?

Lloyd Ronick at 02:51PM, 2011/08/16.

1 2 3 4 5

How do prevent the 'close' link from displaying (other than a display:none for in the css)

Norm Strassner at 10:46PM, 2011/08/23.

1 2 3 4 5

Same problem here.

Shachar at 11:20PM, 2011/09/18.

1 2 3 4 5

Sorry, could not add successfully the quote of LLOYD RONICK:I get the same problem: "loading content, please wait" constantly only for dynamic content.

Shachar at 11:25PM, 2011/09/18.

1 2 3 4 5

m also getting the same problem : "loading content, please wait"any resolves??

aditya at 06:33AM, 2011/11/12.

1 2 3 4 5

We always have the same problem "loading content, please wait".But too I want to know how we can refresh automticaly the parent page of the modal message script on close ?Thanks

Del6 at 12:55PM, 2012/01/05.

1 2 3 4 5

This Demo works on a server but in local files it doesn't.In the Demo for "the Message from url (example 1)", if we choose Close or Send it does the same things, but how we can proceed to send input or texarea to update a database and after refresh the page behind the the modal message ?Thanks a lot

Del6 at 08:13AM, 2012/01/06.

1 2 3 4 5

If you're getting the "loading content" error, then it's an error with whatever script you are running on the popup page.To troubleshoot this, either comment out the script and reload (the popup should display without that error) or open the popup page directly in your browser rather than click on the hyperlink to it; any scripting error will display as you would expect.

Calum at 12:09PM, 2012/03/06.

1 2 3 4 5

How can I pass a value to the messageObj.setSize(400,180);(in particular the height, 180)? I'm using your excellent script to display poems on a site, however they are all different lengths so require different height (and width if possible). Please explain clearly as I'm a n00b! Thanks in advance, and thanks for all the great codes!

Anon at 06:47PM, 2012/04/19.

1 2 3 4 5

Ignore that ^ I worked it out. Thanks!

Anon at 09:38PM, 2012/04/19.

1 2 3 4 5

script does not work with explorer 9... fix wanted ... thanks

Rene at 04:48PM, 2012/06/03.

1 2 3 4 5

Hi All, :-)
I experience the same problem, regarding "loading content, please wait", allthough I run everything from the server.
Can anyone give a hint pls.

Thanks in advance.

lars at 11:50AM, 2012/09/18.

1 2 3 4 5

Hi,
I checked your demo in IE7. your demo worked well. but when i using downloded files in Localhost it wasnt work. why?/ please answer my question and save a LIFE! (:

Roger at 09:13PM, 2013/01/11.

1 2 3 4 5

This demo doesn't works in chrome version 29.It opens like a dot at the corner of the page....Can anyone sort it out.....Awaiting for reply

Saravanan at 06:33AM, 2013/09/24.

1 2 3 4 5

Hi, what license is this released under?

Peter at 09:16AM, 2013/11/07.

1 2 3 4 5

We are planning to use this on a commercial website , What type of license should we be purchasing. we will be using this for 1 website and just this script. We will have 1 domain with 3 sub-domains.

Arun at 10:03PM, 2015/12/03.

Post your comment

Your name:
Your email:
Your website:
Don't have an avatar? Create one at Gravatar.com.

 

Confirmation code:

Please wait...

Comment preview:

Type some text to see comment preview...

Anonymous at 10:00, 04-26-2024.