x0popup-纯js弹出对话框插件 An alternative to original alert, confirm and prompt

jQuery之家 返回下载页
Bored with the original javascript alert? Now is the time to try something new!
Alert
x0p('Message', 'Hello world!');

The most simple one.

弹出对话框
Confirm
x0p('Confirmation', 'Are you sure?', 'warning');

A confirmation popup with a default icon.

弹出对话框
Prompt

An input popup with a callback function.    弹出对话框

x0p('Enter Your Name', null, 'input',
    function(button, text) {
        if(button == 'info') {
            x0p('Congratulations', 
                'Your name is ' + text + '!', 
                'ok', false);
        }
        if(button == 'cancel') {
            x0p('Canceled', 
                'You canceled input.',
                'error', false);
        }
    });
Want more? Here we go!
Custom Popup

Another way to call x0popup.    弹出对话框

x0p({
    title: 'Custom Popup',
    text: 'What is your choice?',
    animationType: 'slideUp',
    icon: 'custom',
    iconURL: 'image/thinking.svg',
    buttons: [
        {
            type: 'error',
            text: 'First'
        },
        {
            type: 'info',
            text: 'Second'
        }
    ]
}, function(button) {
    x0p({
        title: 'Your choice', 
        text: 'You clicked ' + button + ' button!',
        overlayAnimation: false
    });
});
Auto Close

Auto close the popup after some time.    弹出对话框

x0p({
    title: 'Auto Close',
    text: 'This popup will auto close in 3 seconds.',
    animationType: 'slideDown',
    icon: 'info',
    buttons: [],
    autoClose: 3000
});
Async Operation

Show a loading animation while executing.    弹出对话框

x0p({
    title: 'Async Operation',
    text: 'Try to do some operation.',
    icon: 'info',
    animationType: 'fadeIn',
    buttons: [
        {
            type: 'cancel'
        },
        {
            type: 'info',
            text: 'Do It!',
            showLoading: true
        }
    ]
}, function(button) {
    if(button == 'info') {
        // Simulate Delay
        setTimeout(function() {
            x0p('Done', null, 'ok', false);
        }, 1500);
    }
});
Advanced Input

Placeholder, validator, etc.    弹出对话框

x0p({
    title: 'Number Check',
    type: 'warning',
    inputType: 'text',
    inputPlaceholder: 'Number Only',
    inputColor: '#F29F3F',
    inputValidator: function(button, value) {
        if(value == '' || isNaN(value))
            return 'Not a number!';
        return null;
    }
}, function(button, text) {
    if(button == 'warning') {
        x0p('Congratulations', 
            'Your number is ' + text + '!', 
            'ok', false);
    }
});