给定一个正文上带有背景图像的 html 页面，当按下键盘上的箭头键时，如何移动背景，例如按下左键时背景向右滚动，按下右键时背景向左滚动等。
最佳答案
背景图像的位置可以使用background-position css属性来控制，您可以从JavaScript代码中设置该属性。
在下面的示例中，jquery 用于在按下某个键时触发一个事件，并且根据按下的箭头键，background-position-x 或 background-position-y 属性以 10 像素为增量进行调整。
var initX = 0;
var initY = 0;
$(document).keydown(function(e){
if(e.keyCode == 38) {//up
initY += 10;
document.getElementsByTagName('body')[0].style.backgroundPositionY = initY + "px";
}
else if(e.keyCode == 40) {//down
initY -= 10;
document.getElementsByTagName('body')[0].style.backgroundPositionY = initY + "px";
}
else if(e.keyCode == 37) {//left
initX += 10;
document.getElementsByTagName('body')[0].style.backgroundPositionX = initX + "px";
}
else if(e.keyCode == 39) {//right
initX -= 10;
document.getElementsByTagName('body')[0].style.backgroundPositionX = initX + "px";
}
});body{
background-image: url("https://www.nasa.gov/sites/default/files/thumbnails/image/apollo_17_-_resize.jpg");
}<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<body>
some content
</body>关于javascript - 按下箭头键时移动 HTML 背景，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/29672264/