如何实现元素的淡入淡出和滑动效果？

Question

我想要对一个元素进行滑动和淡入效果，当我尝试这样做时

$("ul", this).fadeIn(300).slideDown(600);

我刚才了解了fadeIn，但如何在滑动元素时实现淡入淡出效果呢？

- Jiew Meng

Answer 1

你可以使用动画来实现这个功能。

$("ul").animate({
"height": "toggle", "opacity": "toggle" 
}, "slow");

- lc0

Answer 2

这将会下滑然后淡入

在某个地方插入这个函数

jQuery.fn.doubleHide = function(){
    return $(this).hide().css('opacity', '0');
}


jQuery.fn.slideFade = function(slide, fade){
return $(this).slideDown(slide, function () {
    $(this).fadeTo(fade, 100);
    });
}

那么您可以像调用fadeIn()函数一样调用这个函数。

        $(this).stop(true).doubleHide().slideFade(400, 2000);

- Ruttyj

Answer 3

先尝试在链接或其他方式中调用hide()，然后交换函数：

$("ul").hide().slideDown(600).fadeIn(300);

- TheDeveloper

---

@TheDeveoper，恐怕这仍然按照过程顺序进行调用。只有在slideDown完成后，fadeIn才会开始。 - lsuarez