jQuery UI模式对话框覆盖淡出

是否可以在jQuery UI模式对话框覆盖上应用淡出效果？问题是当模式对话框关闭时，覆盖div被破坏，从而阻止任何类型的动画。这是我有这样的代码，如果覆盖div没有被关闭销毁。jQuery UI模式对话框覆盖淡出

$("#edit-dialog-box").dialog(
{ 
    autoOpen: false, 
    modal: true, 
    width: "30em", 
    show: "fade", 
    hide: "fade", 
    open: function() 
    { 
     $(".ui-widget-overlay").hide().fadeIn(); 
    }, 
    close: function() 
    { 
     $(".ui-widget-overlay").fadeOut(); 
    } 
});

来源

2012-08-31 Alex Jorgenson

是否在'beforeclose'工作淡出？ –

它似乎没有工作。 –

演示：http://jsfiddle.net/276Ft/2/

$('#dialog').dialog({ 
    autoOpen: true, 
    modal: true, 

    width: '100px', 
    height: '100px', 

    show: 'fade', 
    hide: 'fade', 

    open: function() { 
     $('.ui-widget-overlay', this).hide().fadeIn(); 

     $('.ui-icon-closethick').bind('click.close', function() { 
      $('.ui-widget-overlay').fadeOut(function() { 
       $('.ui-icon-closethick').unbind('click.close'); 
       $('.ui-icon-closethick').trigger('click'); 
      }); 

      return false; 
     }); 
    } 
});

来源

2012-08-31 03:04:47

我分叉你的提琴手给覆盖层一个背景颜色和覆盖仍然不会淡出。我也试过在我的网站上没有运气。编辑：正确的小提琴叉：http://jsfiddle.net/276Ft/ –

对不起。更新后的链接：http://jsfiddle.net/276Ft/ –

这真是太棒了，足够接近我的完美！更新上面的答案，并将其标记为正确。非常感谢你！ –

我知道这是一个老话题，但...

我宁愿不重叠的淡出绑定到“closethick”关闭事件。这一个工作，如果您使用的是“取消”按钮，或者如果对话框做别的由于其他按钮后会自行关闭：

$('#dialog').dialog({ 
    autoOpen: true, 
    modal: true, 

    width: '100px', 
    height: '100px', 

    show: 'fade', 
    hide: 'fade', 

    open: function() { 
     $('.ui-widget-overlay', this).hide().fadeIn(); 
    }, 

    beforeClose: function(event, ui){ 
     // Wait for the overlay to be faded out to try to close it again 
     if($('.ui-widget-overlay').is(":visible")){ 
      $('.ui-widget-overlay').fadeOut(function(){ 
       $('.ui-widget-overlay').hide(); 
       $('.ui-icon-closethick').trigger('click'); 
      }); 
      return false; // Avoid closing 
     } 
    } 
});

来源

2018-02-20 13:28:01

jQuery UI模式对话框覆盖淡出

回答

相关问题