您好,我是网络编程的初学者。我在“CodeAcademy.com”学习。我正在做一个小页面来练习我已经学到的东西,但是我的代码有问题。 Here is the Page
我想让 Logo 在按下 W A S D 时移动并编写了代码,但出了点问题。
我的 HTML
<!DOCTYPE html>
<html>
<head>
<link rel="stylesheet" href="style.css" />
<script src='script.js'></script>
<script src="//ajax.googleapis.com/ajax/libs/jqueryui/1.9.1/jquery-ui.min.js"> </script>
<title></title>
</head>
<body>
<div id='menu'>
<h3>Header 1</h3>
<div><p>The jQuery UI library bestows on us a lot of magic, including the datepicker widget. We saw how to use that in the date picker project, but with our knowledge of JavaScript, we can add all kinds of bells and whistles.</p></div>
<h3 id='h3'>Header 2</h3>
<div id="move"><img src="http://www.gravatar.com/avatar/9aba2f4a04dbccedb70a93033b55b166?d=retro&s=140"/></div>
<h3>Header 3</h3>
<div><img id='2' src="http://www.gravatar.com/avatar/9aba2f4a04dbccedb70a93033b55b166?d=retro&s=140"/></div>
</div>
</body>
还有我的 JS。
$(document).ready(function()
{
$('#menu').accordion();
$('#2').draggable();
$('#move').keydown(function(key)
{
switch(parseInt(key.which,10))
{
case 65:
$('#move').animate({left: "-=10px"}, 'fast');
break;
case 83:
$('#move').animate({top: "+=10px"}, 'fast');
break;
case 87:
$('#move').animate({top: "-=10px"}, 'fast');
break;
case 68:
$('#move').animate({left: "+=10px"}, 'fast');
break;
default:
break;
}
});
});
这是怎么回事?
最佳答案
我不是 100% 确定这是否是您的问题,但这不是一个合适的选择器:
$('移动')
应该是.move,或者#move。
关于javascript - 如何使用 JQuery keyDown 移动图片?,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/17407968/