Question

虽然在我真正需要一个不使用JQuery的解决方案之前我已经可以看到这个问题，但它是一个嵌入式Web界面，我不想要加载jQuery的开销。我需要能够在单个页面上仅使用JS来操作sprite，sprite的状态依赖于某些JS变量。我确信这一定是可能的，但如果不使用JQuery就找不到任何东西。

Answer 1

最简单的方法（我认为）是定义自己的css类并更改certan事件的这些关系。即。

<style type="text/css">
.bg1{
/* Some attributes set here */
background-position:cen‌ter;
}
.bg2{
/* Some attributes set here */
background-position:left;
}

</style>

然后你把你的javascript这样

document.getElementById("some_id").class = "bg2";

Answer 2

我认为你可以使用Object.style.backgroundPosition =“position”来改变你想要的背景位置。

试试此代码

 <!DOCTYPE html>
<html>
<head>
<style>
div
{
background-image: url('example.png');
background-repeat: no-repeat;
width: 400px;
height: 400px;
border: 1px solid #000000;
}
</style>
<script>
function displayResult()
{
document.getElementById("div1").style.backgroundPosition="center bottom";  
}
</script>
</head>
<body>

<button type="button" onclick="displayResult()">Position background image</button>
<br>
<div id="div1">
</div>

</body>
</html>

Reference

用Javascript改变背景位置？

2 个答案: