0

多年来我一直对此感到困惑，但我似乎无法确定如何使 .animate 和 .fadeIn 同时发生，而不是连续发生。

所以当我尝试它时，对象会淡入，然后移动，但我很想实现这样的目标：

http://www.schoolwebsite.com/ - 例如，查看出现在页面底部悬停社交媒体图标上的工具提示

请参阅下面的我的尝试

$(".content_slider li a").hover(function () {
    $(this).find('.hover_arrow').animate({
        "bottom": "+=100px"
    }, "fast").fadeIn('fast');
},function () {
    $(this).find('div.hover_arrow').animate({
        "bottom": "+=100px"
    }, "fast").fadeOut('fast');
})

非常感谢任何帮助:)

4

2 回答 2

1

fadein为什么不将 opacity 与 animate 方法一起使用，而不是作为单独的方法使用？

$(this).find('.hover_arrow').animate({"bottom": "+=100px", "opacity": "1"}, "fast")}

您必须更改 CSS 以将项目设置为 " opacity: 0" 而不是 just display: none;，但您可以将效果包含在单个函数中

如果你想保留 display: none （对于一个干净的界面），你可能还想包含这个调用：

$(this).find('.hover_arrow').show() //display: block
$(this).find('.hover_arrow').animate({"bottom": "+=100px", "opacity": "1"}, "fast")} //opacity: 1
于 2013-10-18T15:03:00.983 回答
0

两者animate都有fadeIn选择queue。

默认情况下，它们最终在同一个队列中，因此在另一个队列中执行。

要么将它们放在单独的队列中，要么根本不将它们排队。

另请参阅： jQuery 中的队列是什么？

于 2013-10-18T15:12:21.233 回答