javasctipt 中的 backgroundPosition 不起作用答案

【问题标题】：backgroundPosition in javasctipt is not workingjavasctipt 中的 backgroundPosition 不起作用
【发布时间】：2011-09-05 16:12:19
【问题描述】：

基本上我在 css 中做了一个翻转，但我想要它在 javascript 中。我也想要，一旦我的页面被加载，其中一张图片将被自动选择。我为此尝试了这段代码，但它不起作用..有什么想法吗？由于某种原因，它没有调用该函数。 ps：在我的html中，id也被称为clicked3

<script type="text/javascript">

window.onLoad=function(){
clicked3();
}

function clicked3(){
document.getElementById("clicked3").style.backgroundPosition = "-198px top";
}

</script>

【问题讨论】：

标签： javascript css background position background-position

【解决方案1】：

帮自己一个忙，使用 javascript 库，例如 jQuery...

1) Javascript 区分大小写，因此 window.onLoad 与 window.onload 不同（正确的 sintax）

2) 如果你的图片正好是 198px 宽（你隐藏了图片），你可能忘记在你的 CSS 中添加background-repeat:no-repeat;，让你看到该图片的副本

无论如何，您更改背景位置的语法是正确的，请在此处查看实际操作：

http://jsfiddle.net/zszB4/

【讨论】：

【解决方案2】：

您的代码无法正常工作的真正原因是您将函数分配给了一个不存在的事件处理程序onLoad。 window.onload 是正确的语法，注意都是小写。

http://jsfiddle.net/9Kh8f/3/

【讨论】：

【解决方案3】：

你不需要window.onload=function..你可以调用...

window.onload=clicked3();

在这里为你工作演示:)

http://jsfiddle.net/9Kh8f/

【讨论】：

window.onload=clicked3(); 将 onload 事件设置为触发 clicked3 函数的返回值。它实际上与使用 window.onload=document.getElementById("clicked3").style.backgroundPosition="-198px top"; 相同
为什么我被否决了？这是海报问题的有效解决方案？有了这个，他可以通过删除 window.onLoad 将它添加到按钮点击和许多其他类似的点击中。
它“起作用”的原因是因为您立即调用了该函数，这不是一个正确的解决方案。您的 window.onLoad 从未被解雇，因为 a) 它被包装在 onload 事件本身中，而 b) onLoad 不是正确的方法 onload 是。
他发布的代码显示他希望立即调用它？并为 onload 错字道歉，但是如果您参考 jsfiddle 它是正确的。
您的代码有效，但这只是因为您将其包装在 MooTools onload 事件中，然后您立即调用 clicked3 函数，同时将返回值（在本例中未定义）分配给不存在的属性窗口对象 (onLoad)。