我试图在加载文档时将框从右向左移动 50 像素。我做了很多搜索，我很难过。
起初我认为这很容易做到，而且我本来打算在其中编写一个点击事件来取乐，但我被卡住了。
这是HTML
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8" />
<!-- Always force latest IE rendering engine (even in intranet) & Chrome Frame
Remove this if you use the .htaccess -->
<meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1" />
<meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1" />
<link rel="stylesheet" href="http://code.jquery.com/mobile/1.3.0/jquery.mobile-1.3.0.min.css" />
<link rel="stylesheet" href="css/gameCSS.css" />
<script src="http://code.jquery.com/jquery-1.9.1.min.js"></script>
<script src="http://code.jquery.com/mobile/1.3.0/jquery.mobile-1.3.0.min.js"></script>
<meta name="apple-mobile-web-app-capable" content="yes" />
<link rel="apple-touch-icon" href="media/apple-touch-icon.png"/>
<link href="media/apple-touch-startup-image-iphone.png" media="(device-width: 320px)" rel="apple-touch-startup-image"/>
<link href="media/apple-touch-startup-image-iphone-retina.png" media="(device-width: 320px) and (-webkit-device-pixel-ratio: 2)" rel="apple-touch-startup-image"/>
<script src="js/jgame.js"></script>
<title>HTML</title>
<meta name="description" content="" />
<meta name="author" content="CREEE" />
</head>
<body>
<div id="home" data-role="page">
<div id="box">
</div>
<div id="obs">
</div>
</div>
</body>
这是我的 CSS
#box {
width: 40px;
height: 40px;
background-color: blue;
margin: 1px;
top:10px;
position:absolute;}
#obs {width: 15px;
height: 15px;
border: solid, 2px;
background-color: red;}
这是我的 jQuery
$(document).ready(function() {
$('#box').animate({left: "+=50px",'slow'}, 1000);
});
最佳答案
试试这个:
$('#box').animate({left: "+=50px"}, 1000);
删除“慢”。 checkout the fiddle here
我试图在加载文档时将框从右向左移动 50px。
此注释不正确您的代码将 #box 移动到 从左到右 50px
关于jQuery.animate 很难从右到左移动一个 div，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/15240367/