jQuery：FadeOut SlideUp

Question

如果一個項目正在被刪除，那麼我想淡出它並將其他元素向上滑動以填充空白空間。現在，當我使用​​時，該項目的末端沒有高度，導致其他項目跳起來（而不是很好地滑動）。

如何才能slideUp()和元素之後​​？

Answer 1

jQuery.fn.fadeThenSlideToggle = function(speed, easing, callback) { 
    if (this.is(":hidden")) { 
    return this.slideDown(speed, easing).fadeTo(speed, 1, easing, callback); 
    } else { 
    return this.fadeTo(speed, 0, easing).slideUp(speed, easing, callback); 
    } 
}; 

我在JQuery 1.3.2上測試了它，它確實有效。

編輯：這是我從它調用它的代碼。 ＃滑動然後褪色是按鈕元件的ID，物品文本是div標籤的類：

$(document).ready(function() { 
    $('#slide-then-fade').click(function() { 
    $('.article-text').fadeThenSlideToggle(); 
    }); 
}); 

編輯2：修改爲使用內置的效果基本show。

編輯3：改寫爲肘，以及使用fadeTo

Answer 2

難道你不能鎖鏈嗎？

$('myelement').fadeOut().slideUp(); 

編輯：

也許this將幫助呢？

Answer 3

的淡出功能需要一個回調函數的第二個可選的參數，所以你應該能夠做這樣的事情：

$('elementAbove').fadeOut(500, function() { 
    $('elementBelow').slideUp(); 
}); 

編輯：忘了淡出的速度添加作爲第一個參數

Answer 4

聽起來像這將是更好地使用了jQuery fadeTo命令

$(function() { 

    $("#myButton").click(function() { 
     $("#myDiv").fadeTo("slow", 0.00, function(){ //fade 
      $(this).slideUp("slow", function() { //slide up 
       $(this).remove(); //then remove from the DOM 
      }); 
     }); 

    }); 

}); 

Working Demo here。

通過執行上述命令的回調函數中的每個命令，命令將不會運行，直到前一個命令完成;當元素從DOM中被移除而不等待slideUp完成時發生「跳躍」。

Answer 5

$("#id").fadeIn(500, function() { 

    $("#id2").slideUp(500).delay(800).fadeOut(400); 

}); 

Answer 6

嘗試$('.row').animate({ height: 'toggle', opacity: 'toggle' }, 'slow').slideUp();

demo Here