Center Draggable Jquery对话框

时间:2013-11-18 16:07:31

标签: javascript jquery html css jquery-ui

在过去的几个小时里,我一直试图创建一个动画对话框来启动抽吸动画,可以拖动,当关闭时会在打开时再次居中。截至目前我已经拥有它,所以动画启动,它是可拖动的,但是当我关闭并打开它时,它被固定在它被拖动到的相同位置。

我尝试过使用open函数,show / hide中的完整函数,在函数中设置div / dialog,使用position:center和yeah ...

无论如何,这是代码:

frm_location.jsp:

//这是一个“a”标签,似乎无法正常显示

id =“NEW_LOCATION_BUTTON”href =“javascript:openDialog('#dialog-form','#popupBoxCancel','orange-theme','625');”类= “btn_sel” >

jQueryDialog.js:

function openDialog(_dialog,_cancel,_theme,_size){

jQuery(document).ready(function ($) {
        $(_dialog).dialog({
            autoOpen: true,
            width: _size,
            modal: true,
            position: "center",
            resizable: false,
            draggable: true,
            dialogClass: _theme,
            show: {
                effect: "puff",
                percent: "-150",
                duration: 250

            },
            hide: {
                effect: "puff",
                percent: "-150",
                duration: 250,
            },
        });

    $(_cancel).click(function() {
        $(_dialog).dialog("close");
    });

}

1 个答案:

答案 0 :(得分:1)

看看这个。我不确定你是如何重新打开对话框的,但是应该这样做。 jsfiddle code

<div id='dialog'>PUFF</div>
<button id='reopen'>OPEN DIALOG</button>

  $(function () {
    $('#reopen').click(function () {
        $( "#dialog" ).dialog({ position: 'center'});
        $('#dialog').dialog('open');
    });

    $('#dialog').dialog({
        autoOpen: true,
        width: 200,
        modal: true,
        position: "center",
        resizable: false,
        draggable: true,
        show: {
            effect: "puff",
            percent: "-150",
            duration: 250

        },
        hide: {
            effect: "puff",
            percent: "-150",
            duration: 250,
        },
    });
});