问题标签 [background-position]

我正在定位背景精灵并更改悬停位置（使用 jQuery），它在 Chrome、IE（8）和 Safari（我在 PC 上，Win 7）中按预期工作，但我遇到了问题火狐 (4)。没有任何反应，在错误控制台中我得到了这个：

警告：解析“背景位置”的值时出错。声明被放弃。

我最初是这样定位背景的：

并像这样改变悬停位置：

为了调试，我尝试将'-787px left'更改为'top left'并且效果很好，所以问题似乎是在 Firefox 中使用 px 定位背景？这是一个错误（一个功能......呵呵）还是我只是做错了什么......？（我也尝试过使用 em 和 % 但都没有奏效。）

我有一个带有两个图像的精灵，一些功能框的顶部和底部圆形边框。一些示例 HTML：

和CSS：

在 FF 3 和 4、Chrome、IE 7、8 和 9 中，它按应有的方式显示，其中 .top 和 .bottom div“拥抱”中间 div 以创建盒子效果。

但是，在 IE6 中，.top div 显示了整个背景图像，并且似乎以某种方式增加了它的高度，即使开发人员工具栏告诉我高度是 4px，它显然不是因为它显示了整个 8px 图像然后大致在中间 div 开始之前，它下面的相同数量的像素空白。

以前有人经历过吗？任何反馈表示赞赏

谢谢

嘿伙计们， 如果没有 protofunc() 的背景位置插件，我无法制作简单的背景图像动画。

我之前使用过该插件，一切正常。然而，自从 jQuery 的 1.6 版本以来，该插件已损坏并且不再工作。

如果没有这个插件，我有没有机会制作一个简单的 backgroundPosition 动画？

这是我正在使用的代码：

我以前做过这种事情，但现在对我不起作用......

我有一个容器 div，里面有一个带有部分透明图像的 div。当用户将鼠标悬停在容器 div 上时，我希望该 div 上的背景移动 0px -56px。我已经尝试过像往常一样使用动画，但它不起作用。最初我的旧脚本在 1.6 中不起作用，所以我回到 1.4.2，它没有任何区别，所以也许我的代码只是垃圾......

有任何想法吗？

我遇到了一个问题：/ 我有一个 CSS 东西，它可以在悬停时改变背景位置。但是在我在 javascript 中运行一个改变悬停的函数之后，CSS 停止工作。

这是功能：

}

住http://enji.se（按左上角的树）

我有 3 个伪装成“翻转按钮”的标签。

每个按钮都从 CSS 中获取其初始图像，如下所示：

现在，当我尝试为每个特定元素分配初始背景位置时：

问题：每个按钮默认位置为 0 0

请注意，悬停位置按预期工作。

我现在有点不舒服，所以这可能是一个疏忽，但我已经在这个问题上徘徊了一个小时，无法弄清楚。

有什么想法吗？

谢谢

编辑pastebin 爱http://pastebin.com/SeZkjmHa

所以我正在工作应该是一个漂亮的效果。我有一堆li40px 的高度。我想要显示一个背景图像，以便顶部 40px 是第一个的背景li，下一个 40px 是第二个的背景......等等......

目前它只会显示图像的顶部，我无法让 bgCount 增加......有什么建议吗？

JSfiddle：http: //jsfiddle.net/yZDDK/4/

这是我的CSS：

这是我的 HTML：

我试图让我的图像以 X 轴为中心，并在 Y 轴上置顶。但是我的 CSS 类.header不会那样做。你能看到我做错了什么吗？

编辑：转动顶部中心也不起作用

我为我的画廊使用图像精灵。为了在正确的位置获得正确的背景图像，我使用了这个：

当有许多 div 标签并且要添加的数字是例如 73px 而不是 200 时，计算所有背景值是很耗时的。而且它占用了大量的 css 代码。

我可以使用 CSS3 以另一种方式实现相同的结果吗？

否则我想知道是否有人可以查看我的 jquery 脚本，看看是否有可以以更好的方式完成的事情（脚本有效）：

在尝试升级 jQuery 插件“iCheckbox”（http://stackoverflow.com/questions/6032538/）以在 jQuery 1.4.4 之上工作时，我发现使用

需要改为

因为只应使用具有一个参数的属性。到目前为止，这是有道理的，但是等等……虽然它在 Safari 和 Chrome 中运行良好，但在 FF4 中却无法运行（全部在 Mac 上）。

所以我尝试了这个和那个，最后发现如果我把它改成

它无处不在！但是这里发生了什么？现在我只给出一个参数，它可以工作，但我没有指定它是用于 X 轴还是 Y 轴（所以它似乎默认为 X 轴。但是如果我希望它在 Y 轴上工作呢？）

这看起来很奇怪，我的解决方案不是正确的方法。所以我需要一些建议：

这是怎么回事？

应该如何使用 jQuery 1.4 - 1.6 对背景位置进行动画处理，以便它可以跨浏览器工作？