我正在尝试使用 jQuery 为块级元素设置动画。页面加载样式为 的元素display: none
。我喜欢它slideDown
虽然透明,然后fadeIn
使用回调的内容,但是slideDown
似乎在fadeIn
调用之前将可见性设置为完全,导致内容在slideDown
动画期间可见。
有谁知道实现这一目标的方法?
我正在尝试使用 jQuery 为块级元素设置动画。页面加载样式为 的元素display: none
。我喜欢它slideDown
虽然透明,然后fadeIn
使用回调的内容,但是slideDown
似乎在fadeIn
调用之前将可见性设置为完全,导致内容在slideDown
动画期间可见。
有谁知道实现这一目标的方法?
您的代码可能存在一些问题:您是否在开始时也将内容设置为隐藏?你fadeIn
在slideDown
回调期间打电话吗?
这是一些示例 HTML/代码,将fadeIn
在slideDown
$('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>
怎么样:
$('#hiddenElement').css("opacity", 0).slideDown().animate({opacity:1})
我需要将 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 }); });