高手请略过....

借助jquery的样式做一个类似jqueryUI里面的弹出框。(项目里需要这么做而已)

function ShowDialog(d_title,d_msg,d_width,d_height)
{
    $("#dialog_div").remove();
    var dialog_html="";
    dialog_html=dialog_html+'<div >;
    dialog_html=dialog_html+'    <div class="ui-dialog-titlebar ui-widget-header ui-corner-all ui-helper-clearfix draggable-handle" unselectable="on" style="-webkit-user-select: none;">';
    dialog_html=dialog_html+'        <span class="ui-dialog-title" >;
    dialog_html=dialog_html+'        <a href="#" class="ui-dialog-titlebar-close ui-corner-all" role="button" unselectable="on" style="-webkit-user-select: none;">';
    dialog_html=dialog_html+'        <span class="ui-icon ui-icon-closethick" unselectable="on" style="-webkit-user-select: none;">close</span></a>';
    dialog_html=dialog_html+'    </div>';
    dialog_html=dialog_html+'    <div >;
    dialog_html=dialog_html+'    </div>';
    dialog_html=dialog_html+'</div>';
    
    var dialog=$(dialog_html);
    $("a",dialog).click(function(){$("#dialog_div").remove();});
    $("#dialog_title",dialog).html(d_title);
    $("#dialog_content",dialog).html(d_msg);    
    $("body").append(dialog);
    $("#dialog_div").css({width:d_width+"px",height:d_height+"px"});
    $("#dialog_div").draggable({handle:'.draggable-handle'});    
    
}

function HideDialog()
{
    $("#dialog_div").remove();
}

效果图

自定义弹出框

 

 

 

相关文章: