使用jQuery实现以下效果

Question

目前这是我的过渡期。

$(".element").css("visibility", "visible");

元素隐藏在css中，而javascript使其可见

但是我想要实现的是一种微观的效果，基本上我希望元素从下到上滑动（所以我假设底部有负边距而不是用javascript使其正面）而且它也是正在滑入，从0不透明度淡入到完全不透明度，两种效果应该有某种持续时间，结合在一起它们应该看起来非常好。

Answer 1

查看 jQuery 的.animate()：http://api.jquery.com/animate/;）

Answer 2

查看$(".element").slideToggle('slow')和$(".element").show('slow')

此处无需使用.animate() ..

http://api.jquery.com/slideToggle/ - 看一下演示！

Answer 3

如果您想在jQuery中完全使用解决方案，请尝试以下两种方法：

fadeIn()

slideUp()（或者slideToggle（）也会起作用，具体取决于你编写脚本的方式）

Answer 4

我将从0不透明度和小上边距开始，然后使用.animate()为其设置动画。尝试类似：

$(".element").css({
    opacity: 0,
    visibility: 'visible',
    marginTop: 20
}).animate({
    marginTop: 0,
    opacity: 1
});

演示：http://jsfiddle.net/Pc8q6/

请注意，使用CSS过渡也可以达到类似的效果，演示：http://jsfiddle.net/Pc8q6/1/（webkit）