NinjaModal

ninjaModal({
    title: "Modal Title",           //-- set a title to the modal ,
    width: 350,                     //-- set the width in pixels. 
                                    //-- set to {0} to be automatically adjusted according to the content.

    css: null,                      //-- set a css class to customize it.
                                    //-- to responsive use one of these css class {nc-modal-small, nc-modal-medium or nc-modal-large}

    html: "This is a sample",       //-- the html message to be displayed
    element: "#myModal",            //-- set the id of a html element to be displayed as content (this property overrides [html] option)
    contentAlign: "center",         //-- set the default alignment to the content ["left", "right" or "center"]
    buttonsAlign: "right",          //-- set the alignment to the buttons bar
    verticalPosition: "center",     //-- set the vertical alignment where the modal will be displayed ["top", "center"]
    position: "absolute",           //-- set if the modal will be fixed or absolute positioned ["absolute", "fixed"]
    onLoad: function() { },         //-- set a function to be executed when the modal is opened
    onClose: function() { },        //-- set a function to be executed when the modal is closed
    buttons: [                      //-- array of objects [text, css and callback]
        {
            name: "ok-button",              //-- set a name for this button
            text: "Ok",                     //-- the html text for this button
            css: "nc-btn"                   //-- css class to customize the button style
            callback: function (modal) { }  //-- set a callback function to the button"s click
        }
    ],
    roles: function (btn, item) {           //-- set a function to controll which button will be displayed
        return true;
    },
});