bootbox 사용자 정의 dialog, confirm 및alert 스타일

$(document).ready(function() {
    //bootbox.setDefaults({  
    /**  
                * @optional String  
                * @default: en  
                * which locale settings to use to translate the three  
                * standard button labels: OK, CONFIRM, CANCEL  
                */
    //locale: "fr",  
    /**  
                * @optional Boolean  
                * @default: true  
                * whether the dialog should be shown immediately  
                */
    //show: true,  
    /**  
                * @optional Boolean  
                * @default: true  
                * whether the dialog should be have a backdrop or not  
                */
    //backdrop: true,  
    /**  
                * @optional Boolean  
                * @default: true  
                * show a close button  
                */
    //closeButton: true,  
    /**  
                * @optional Boolean  
                * @default: true  
                * animate the dialog in and out (not supported in < IE 10)  
                */
    //animate: true,  
    /**  
                * @optional String  
                * @default: null  
                * an additional class to apply to the dialog wrapper  
                */
    //className: "my-modal"  
    //});   
});

$(document).on("click", "#test",
function(e) {
    bootbox.confirm("Hello world!", function (result) {  
                if(result) {  
                    alert(' ');  
                } else {  
                    alert(' ');  
                }  
            });  
            bootbox.dialog({  
                message: "I am a custom confirm",  
                title: "Confirm title",  
                buttons: {  
                    Cancel: {  
                        label: "Cancel",  
                        className: "btn-default",  
                        callback: function () {  
                            alert("Cancel");  
                        }  
                    }  
                    , OK: {  
                        label: "OK",  
                        className: "btn-primary",  
                        callback: function () {  
                            alert("OK");  
                        }  
                    }  
                }  
            });  
              
        bootbox.confirm({  
        buttons: {  
            confirm: {  
                label: ' ',  
                className: 'btn-myStyle'  
            },  
            cancel: {  
                label: ' ',  
                className: 'btn-default'  
            }  
        },  
        message: ' ',  
        callback: function(result) {  
            if(result) {  
                alert(' ');  
            } else {  
                alert(' ');  
            }  
        },  
        //title: "bootbox confirm ",  
        });
    bootbox.alert({
        buttons: {
            ok: {
                label: ' ok ',
                className: 'btn-myStyle'
            }
        },
        message: ' ',
        callback: function() {
            alert(' alert');
        },
        title: "bootbox alert ",
    });
});

좋은 웹페이지 즐겨찾기