2

我正在尝试使用 jQuery 为块级元素设置动画。页面加载样式为 的元素display: none。我喜欢它slideDown虽然透明,然后fadeIn使用回调的内容,但是slideDown似乎在fadeIn调用之前将可见性设置为完全,导致内容在slideDown动画期间可见。

有谁知道实现这一目标的方法?

4

4 回答 4

2

您的代码可能存在一些问题:您是否在开始时也将内容设置为隐藏?你fadeInslideDown回调期间打电话吗?

这是一些示例 HTML/代码,将fadeInslideDown

$('div').hide(); // make sure you hide both container/content

$('#container').slideDown('slow', function() {
    $('#content').fadeIn('slow');    // fade in of content happens after slidedown
});

html:

<div id="container">
    <div id="content">stuff</div>
</div>
于 2008-12-05T00:55:14.107 回答
0

怎么样:

$('#hiddenElement').css("opacity", 0).slideDown().animate({opacity:1})
于 2008-12-05T00:53:45.713 回答
0

你的描述听起来像是这个问题的一个变种,前几天我不得不处理这个问题。

它只发生在 IE 中,并且仅在您以 quirks 模式呈现时才会发生。因此,简单的解决方案是切换到标准模式。您可以在此处找到使 IE 以标准模式呈现的文档类型表。

但是如果你和我的情况一样,那不是一个选项,那么你可以为你的 jQuery 库应用一个补丁,你可以在这里找到。

于 2008-12-05T08:28:47.560 回答
0

我需要将 a 添加li到 aul并希望它slideDown首先添加,然后fadeIn.

以下对我有用。我必须首先.hide()设置内容,然后将不透明度设置为 0,然后附加内容,然后slideDown()将不透明度设置为 1。

在下面的代码中,“内容”是li,#ListItems 是ul

$(content).hide().css("opacity", 0).appendTo("#ListItems").slideDown(500, function () { $(this).animate({ "opacity": 1 }, { queue: false, duration: 500 }); });
于 2013-02-16T20:30:18.600 回答