【问题标题】:Center Draggable Jquery Dialog居中可拖动的 Jquery 对话框
【发布时间】:2013-11-19 01:06:56
【问题描述】:

在过去的几个小时里,我一直在尝试制作一个动画对话框,它会启动一个粉扑动画,是可拖动的,并且在关闭时会在打开时再次居中。到目前为止,我拥有它,所以动画启动,它是可拖动的,但是当我关闭并打开它时,它固定在它被拖动到的相同位置。

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

不管怎样,代码如下:

frm_location.jsp:

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

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

jQueryDialog.js:

函数 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");
    });

}

【问题讨论】:

    标签: javascript jquery html css jquery-ui


    【解决方案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,
            },
        });
    });
    

    【讨论】:

    • 我让这个按钮与我非常高兴的按钮一起工作。但是,我似乎使用了一个没有点击事件的区域标签。我将用更完整的图片编​​辑 OP。
    猜你喜欢
    • 2011-08-15
    • 2011-10-07
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 2011-10-05
    相关资源
    最近更新 更多