Question

首先让我说我是HTML，CSS和jQuery的新手。我在大学学习HTML和CSS，我想自学jQuery，所以我可以领先于游戏。

我只是试图动画一些文本（向上移动文本并缩放字体大小），但由于某种原因，我根本无法使文本动画化。有什么我做错了吗？

此外，我已经四处搜索并试图自己解决这个问题但是，我似乎无法得到任何工作。这是我的最后一招。

HTML：

<head>
    <script type="text/javascript" src="http://code.jquery.com/jquery-latest.min.js"></script>

    <script src="modernizr-2.js"></script>

    <script>$("#logo").animate({top:'0px',fontSize:'200%'}, 800);</script>

    <title>Home</title>

<link rel="stylesheet" type="text/css" href="index_layout.css" />

</head>

<body>
    <div id="logo" class="title">Test</div>
</body>

CSS：

.title {
    font-size: 450%;
    font-weight: bold;
    position: absolute;
    right: 35%;
    top: 25%;
}

这是一个jsFiddle：http://jsfiddle.net/MWKrM/1/

我在Mac上使用Firefox。

Answer 1

在将徽标元素添加到DOM之前，您的脚本正在触发。您需要将您的jquery代码包装在document.ready（）方法中：

$(document).ready(function(){
    $("#logo").animate({top:'0px',fontSize:'200%'}, 800);
});

这将延迟代码的执行，直到页面完全加载DOM，此时动画应该正确执行。

Answer 2

JSFiddle

使用$(document).ready(function(){..}

制作脚本

 $(document).ready(function(){
   $("#logo").animate({
      top:'0px',
      fontSize:'200%'
   }, 800);
 });

Answer 3

你需要告诉你的HTML你正在开始jQuery，兄弟。

试试这个：

<script>
$(document).ready(function(){
$("#logo").animate({top:'0px',fontSize:'200%'}, 800);
})
</script>

jQuery Animation没有做任何事情

3 个答案: