I'm trying to use following function with my API.. It works but the background isn't masking. What's wrong?

    dialog: function(message)
   {
    this.OCache = $('<div class="modal">'+ message+'</div>').appendTo('body').overlay
    ({top: 0,mask:{color: '#000',loadSpeed:200,opacity:0.5},closeOnClick:true,load:true});
   }

and this is the css for the modal box

    .modal {
 display:none;
 width:400px;
 background-color:#000;
 border:1px solid #fff;
 padding:10px 15px;
 display:none;
 color:#fff;
 text-align:left;
 font-size:12px;
 /* outline radius for mozilla/firefox only */
 opacity:0.8;
 -moz-box-shadow:0 0 10px #000;
 -webkit-box-shadow:0 0 10px #000;
}

I'm trying to use following function with my API.. It works but the background isn't masking. What's wrong?

    dialog: function(message)
   {
    this.OCache = $('<div class="modal">'+ message+'</div>').appendTo('body').overlay
    ({top: 0,mask:{color: '#000',loadSpeed:200,opacity:0.5},closeOnClick:true,load:true});
   }

and this is the css for the modal box

    .modal {
 display:none;
 width:400px;
 background-color:#000;
 border:1px solid #fff;
 padding:10px 15px;
 display:none;
 color:#fff;
 text-align:left;
 font-size:12px;
 /* outline radius for mozilla/firefox only */
 opacity:0.8;
 -moz-box-shadow:0 0 10px #000;
 -webkit-box-shadow:0 0 10px #000;
}

• javascript

2 Answers 2

You'll need toolbox.expose.js for this to work.

Overlay will not work with just Ui.Overlay.js file. You also need to include toolbox.expose.js.