问题标签 [background-position]

我对 Jquery 很陌生，但终于弄清楚了如何在将鼠标悬停在单独的“触发”图像上时更改我的#contentContainer 的背景图像（精灵）。但是，对于我的生活，我无法弄清楚如何将淡入淡出效果应用于过渡。基本上，我希望它在鼠标悬停和鼠标悬停时平滑淡入，而不是当前突然的背景图像过渡。

这是我的（不褪色但有效）脚本：

非常感谢您的帮助！

看看这个网站：

http://photoshop.tutorialcraft.com/

注意太阳先到顶部，然后再到右边。这是我的代码：

如果它可以采用更拱形的模式，而不是两个直接的动画，那就太好了。如果我在两者之间创建 2 个“关键帧”，在拱门所在的位置，就会出现断断续续的情况，因为 Jquery 简化了动画，而不仅仅是从一个到另一个流动。

我的数学还不够好，无法弄清楚我将如何做到这一点，但由于窗口的宽度是在执行之前计算的，我相信有人可能知道如何做到这一点。

那么如何让它以拱形而不是点对点的形式进行动画处理呢？

我有一个标准的 asp 按钮，点击它会触发：

问题是，当单击按钮时，背景不会向右移动 70 像素。

这是解决这个问题的正确方法还是语法问题？

我对 jQuery（和一般的 JS）是全新的，我知道可以使用它来为我的导航翻转添加淡入淡出效果。

现在我正在为导航使用主背景精灵，并且在 :hover 上我只是添加了一个背景位置规则来为每个项目向下移动精灵以获得我的悬停效果。

但是我想用jQuery来给翻转效果带来一个平滑的过渡。我用谷歌搜索了它并找到了一些类似的信息，但我发现的大部分内容都是处理你有两张图像并且淡出以显示另一张图像的情况。但我使用 CSS background-position 来简单地将图像向下移动。我可以用 jQuery 更平滑地做到这一点吗？如何？

这是网站： http ://tuscaroratackle.com

当我在 IE8 中将我的背景位置设置为正确时会发生这种情况......

您可以在以下 URL 中看到：http ://www.scrapingweb.com/quote.html （联系我们选项卡）

我是一名新程序员，英语不是我的母语，所以请提前原谅我的编程和英语错误。

这是我想要做的：我有一个包含图像和表格的 div 标签（在这个 div 标签之外）。通过jquery，我试图归档一个“裁剪效果”，所以我使我的表格可拖动，并且在拖动时我复制图像并将其设置为我表格的背景。现在我需要能够在表格中动态设置图像的背景位置，以便在拖动图片时看起来是静止的。通过更改（降低）原始图像的不透明度来归档裁剪效果。请注意，我不需要创建销售或类似的东西。首先创建具有给定大小的表。完成此操作后，将表格拖到创建裁剪效果的图像上。

这是我的问题：当我通过 jquery(.css) 设置背景图像的位置时，它不会改变顶部位置，左侧位置也不会按预期工作。

让我们看看javascript代码：

背景的位置现在没有正确设置，但目前没有太大关系。我只是希望有一种方法可以动态地改变顶部位置，我稍后会担心数学。我也希望它足够清楚。亲切的问候，

艾琳

假设我有一个带有很多图标的精灵。我想将其中一个图标放置在 div 上方的特定位置，例如距右侧 15px 和距顶部 20px。以前，当我有单个图像文件时，我使用以下代码：

现在图像在精灵中，我可以使用它访问它

但正如我所见，没有地方可以添加我目前的 91% 47%。有什么解决方法吗？如果有帮助，可以在项目中使用 CSS3。

谢谢！

大家晚上好！我有一半的脚本需要在单击元素时更改它的 CSS 背景位置 - 这很好用。但是，我需要 CSS 在第二次单击时将背景位置重置为 0 0；

非常感谢帮助！

我正在使用图标作为标题等的背景图像，并且我已经使用背景位置来正确对齐它们，所以当我想用适当的精灵切片替换背景图像时，我不能再正确定位背景，是否有解决方案？

我不想为它设置动画（除了在悬停时更改一次）只是为了将切片的精灵定位为背景，即使背景位置已经被采用：

.beautifu1-gallery { 背景位置：-130px 0; }

现在我想在同一个 div 上添加另一个背景位置。

添加另一个 div 可能有效，但它不像我想要的解决方案那样优雅。

编辑评论：精灵对我来说似乎并不实用，即使数量请求大幅下降 - 因此我应该将所有图标编码为单独的图像吗？将它们标记为背景显然更容易 - 它们是什么 - 标题，导航，图像和可下载材料的说明性背景。添加另一个 div 似乎也是一种能源浪费。开发人员是否应该责怪互联网的工作方式仍然围绕基于文本的信息，似乎没有人考虑如何有效地将多个图像、视频、图形、动画从用户传输到服务器或其他方式？

这是色情而不是发展 - 试图在不考虑整体情况的情况下堵住所有可以看到的漏洞。

好吧 - 我只是沮丧地用谷歌搜索，发现了什么是 Data URIs 和 MHTML。游戏结束！

我有一个 100% 宽和 284 像素高的 div，名为 #photoStripe，背景图像为 5000 像素宽。然后在它上面的左右导航按钮。这个想法是能够通过左右递增地为背景图像设置动画来左右平移。

我正在使用流行的背景位置插件，它允许您同时为背景位置的 x 和 y 值设置动画。

好吧，背景动画，但它只做一次。（不能一次又一次地点击）。有什么想法吗？

jQuery：

CSS：