jQuery 不会改变 css 或动画...我做错了什么？

Question

这是我目前拥有的 jsFiddle：https://jsfiddle.net/vst5fky5/

我正在重做 jQuery 中的 Flash 部分。有一个徽标和 7 个内联列表项（导航），我需要从顶部开始制作动画。我想用jQuery在开头加上top:-5em，然后一个一个往下放。

没有任何效果。注意：标志点击功能只是为了测试，我想改变它CSS，然后运行通过页面加载时的动画。

$(document).ready(function(){
    $('.nav a li').css("top:","-5em");
    $('#logo').click(function(){
        $(".nav a li").animate({top:$(this).offset().top}, 'slow');
    });
});

Answer 1

语法问题。您在以下语法中添加了额外的 :。

 $('.nav a li').css("top:","-5em");

应该是

 $('.nav a li').css("top","-5em");

DEMO

Answer 2

使用each()方法得到一个一个的动画效果

$('.nav a li').css("top","-5em");
    $('#logo').click(function(){
        $(".nav a li").each(function(i,e){
          $(e).delay(i*1000).animate({top:$(e).offset().top}, 'slow');
    });
});

DEMO