如何使用javascript更改样式背景属性，使用onmouseover？

Question

如何使用javascript更改样式背景属性，使用onmouseover？

当鼠标悬停not rate为什么id="all_rating"不会更改样式背景属性？

我该怎么做？

http://jsfiddle.net/1x8rLLpt/

<div onmouseover="show_star('-12')">not rate</div>
<br>
<div class="all_rating" id="all_rating">
</div>


<script>
function show_star(bg_position) {    
    document.getElementById("all_rating").style.background = "transparent url(http://image.ohozaa.com/i/eb0/OZDobo.png) no-repeat 0px +bg_position+px;";    
}
</script>

Answer 1

这是因为您需要关闭字符串连接的引号。 JavaScript不会解释字符串中的变量。你也不需要字符串末尾的分号，它会使CSS属性值无效。

document.getElementById("all_rating").style.background = "transparent url(http://image.ohozaa.com/i/eb0/OZDobo.png) no-repeat 0px " + bg_position + "px";

另外，我建议只更新backgroundPosition属性，而不是整个background属性。

document.getElementById("all_rating").style.backgroundPosition = "0px " + bg_position + "px";