Question

好吧所以我只需要在我正在构建的网站上学习几个动画的JQuery。

我一直在阅读JQuery网站上的教程，我只想尝试实现一个简单的对角移动动画。

我仍然是JQuery的新手（如今，从今天开始），但从我理解的一切，下面的代码应该工作。我犯了什么错误？

<head>
<script type="text/javascript" src="JQuery.js">
</script>

<script>
$(document).ready(function(){
    $("#moveme").click(function(event){
    $("#moveme").animate({right: '+=50', bottom: '+=50'}, 1000); 
    });
});
</script>
</head>

<body>
<div id="moveme">
Move this text
</div>
</body>

修改

使用document从css和固定括号问题添加了相对属性，但仍无法正常工作。

Answer 1

似乎你忘记了一些括号来正确选择元素。

怎么样？

$(document).ready(function(){
    $("#moveme").click(function(event){
        $(this).animate({right: '+=50', bottom: '+=50'}, 1000); 
    });
});

修改

此外，确保您正在导入jQuery脚本库：

<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.8.2/jquery.min.js"></script>

Answer 2

你错过了

行中的$（文件）

$的document.ready（函数（）{

Answer 3

另外你的jquery animate函数正在改变你的id =“moveme”的CSS

我确保你的css中有这个。

#id {
    position: relative;
}

Answer 4

你绝对可以这样做：

$(document).ready(function(){
    $("#moveme").click(function(event){
      $(this).animate({'margin-left': '+=50', 'margin-top': '+=50'}, 1000); 
    });
});

在这里工作演示（只需单击div上的'hello'）：http://jsfiddle.net/px2jz/

无法通过jQuery animate（）使元素对角移动

4 个答案: