首页 > 技术文章 > UI、JS框架----Bootstrap、Metro

panpanwelcome 2017-09-07 11:33 原文

Bootstrap Datagrid

 

EasyUI

 

Metro bootstrap

 

Datepicker

 

Editable for Bootstrap:bootstrap-editable.js

 

X-editable:bootstrap-editable.js 升级版

 

jQuery File Upload Demo:图片、声音、视频上传

jQuery-File-Upload:document

 

JavaScript-Load-Image:图片预览

JavaScript Load Image:document

 

 

JavaScript-Canvas-to-Blob:test  :图片与二进制互转

JavaScript Canvas to Blob:Document

JavaScript-Canvas-to-Blob:源码

 

 

 

bootstrap-table:github

bootstrap-table-examples:example

example主页

 

 

bootstrap-multiselect:github

Bootstrap Multiselect:doc & exmaple

 

 

 

bootstrap

 

dialog示例:onshow event

                 $.Dialog({
                            overlay: true,
                            shadow: true,
                            flat: false,
                            icon: '',
                            width: 330,
                            content: '<div class="" style="text-align:left;padding:10px;font-size:16px;">保存成功!</div>'
                                    + '<div class="size4 text-right">'
                                        + '<button class="warning" id="comfirm"><i class="icon-checkmark on-left"></i>关闭</button> '
                                    + '</div>',
                            overlayClickClose: false,
                            onShow: function (_dialog) {
                                $("#comfirm", $(_dialog)).click(function () {
                                    //保存成功返回列表页
                                    $("#back").click();

                                })
                            }
                        });  

 

function showAlert(message, dialogHeight, dialogWidth)
{
    $.Dialog({
        height: dialogHeight ? dialogHeight : 'auto',
        width:dialogWidth?dialogWidth:'auto',
        overlay: true,
        shadow: true,
        flat: false,
        icon: '',
        content: '<div class="" style="text-align:left;padding:20px;font-size:16px;">' + message + '</div>'
                    + '<div class="text-right" style="padding-right:20px;">'
                        + '<button class="warning" onclick="$.Dialog.close();"><i class="icon-cancel on-left"></i>关闭</button>'
                    + '</div>',
        overlayClickClose: false
    });
}

  

 

 

Bootstrap Dialog 

 

 

bootstrap

 

select2

详细doc

推荐阅读