0

好的，所以我只需要在我正在构建的网站上为几个动画学习 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>

编辑：

从 css 添加了相关属性并修复了括号问题，document但仍然无法正常工作。

4

4 回答 4

2

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

那个怎么样？

$(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>
于 2012-11-01T19:03:21.407 回答
1

您错过了 $(document) 在该行

$document.ready(函数(){

于 2012-11-01T19:03:09.830 回答
1

此外，您的 jquery animate 函数正在更改您的 id="moveme" 的 CSS

我会确保在你的 CSS 中有这个。

#id {
    position: relative;
}
于 2012-11-01T19:06:16.407 回答
1

你绝对可以这样做：

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

在这里工作演示（只需点击 div 说“你好”）：http: //jsfiddle.net/px2jz/

于 2012-11-01T19:40:00.057 回答