Question

我是网络开发的新手。我正在尝试将jQuery应用到我的网站，这样当页面加载时，标题就会生动。但由于某种原因，我无法让它发挥作用。这是javascript代码：

$(window).ready(function() {
        $("h1").animate({left:'250px'});
       });

以下是相关的HTML代码：

<!DOCTYPE html>
<html>
<head>
<title> Welcome! </title>
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.11.2/jquery.min.js"></script>
<script src="jquery_functions.js"></script>
</head>

<body>
<h1>Hello!</h1>
</body>
</html>

Answer 1

这是因为h1可能有static 位置。您可能需要为该元素设置CSS relative或absolute 位置，例如

h1 {position: relative}

这个jQuery代码可以正常工作

$(document).ready(function () {
    $("h1").animate({
        left: 250
    });
});

参见 JSFIDDLE

Answer 2

CSS只能使用绝对定位的元素。如果你将位置：绝对值添加到H1标签中，它将起作用。

＆＃13;

$(window).ready(function() {
        $("h1").animate({left:'250px'});
       });

＆＃13;

h1 { position: absolute; }

＆＃13;

<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.11.2/jquery.min.js"></script>

<h1>Hello!</h1>

＆＃13;

Answer 3

我自己很新，但看起来你的动画选项缺少一个参数。

$（＆＃39; img＆＃39;）。animate（{left：＆＃34; - = 10px＆＃34;}，＆＃39; fast＆＃39;）;就是一个例子。你的，它告诉它要移动多少，但你没有离开。

Answer 4

您可以尝试更改

$("h1").animate({left:'250px'});

到

$("h1").animate({marginLeft:'250px'});

Answer 5

也许$(doucment).ready() 我认为这将是有效的））

当页面加载jQuery时动画文本

5 个答案: