A simple JS message box

OK so I’m beginning to appear like an advocate for Javascript! I’m really not, it’s just a very large project I am still working on.

This latest library (as the screen-shot best presents) supports for an attractive message box (I think it’s attractive anyway). I designed the PNG icons myself so there should be no rights issues and everyone is free to use them as they wish.

A simple JS message box (screen-shot)

To customize your message boxes modify the message-box.html and message-box.css files, for documentation see the message-box.js and message-box-setup.html files.

Download message-box.zip

The download contains a message-box-setup.html file, open/view this for the demo. Tested in IE 6/7, Firefox, Opera and Safari.

I have also made quite a bit of progress on the iido application over the last few weeks, and will post a blog about it (including a short video) for early next week.

Advertisements

2 Responses to “A simple JS message box”


  1. 1 Jia-Siang You November 22, 2009 at 6:03 pm

    Hi,
    JS message box is working now!
    But, I have a question.
    Can it launch when the web page is loading?
    What can I do?

    Thank you very much.

    • 2 Anthony Blackshaw November 22, 2009 at 11:39 pm

      Hey,

      Possibly, one option would be to launch the message box when the body loads for the page (but not load the pages body initially). You could then use JQuery to load the pages body seperately (from another HTML resource). For example


      $(document).ready(function(ev) {
      //
      var message_box = new MessageBox();
      message_box.show_busy('Loading', 'We are loading the main body of the page please wait');
      // Use JQuery to load html for the body
      $(body).load("/other-html-page", function(ev) { message_box.hide(); });
      });


Leave a Reply

Fill in your details below or click an icon to log in:

WordPress.com Logo

You are commenting using your WordPress.com account. Log Out / Change )

Twitter picture

You are commenting using your Twitter account. Log Out / Change )

Facebook photo

You are commenting using your Facebook account. Log Out / Change )

Google+ photo

You are commenting using your Google+ account. Log Out / Change )

Connecting to %s





%d bloggers like this: