我以前做过这样的事情，但现在对我不起作用......
我有一个容器 div，里面有一个带有部分透明图像的 div。当用户将鼠标悬停在容器 div 上时，我希望该 div 上的背景移动 0px -56px。我已经像平常一样使用 animate 尝试过此操作，但它不起作用。最初我的旧脚本在 1.6 中不起作用，所以我回到了 1.4.2，它没有什么区别，所以也许我的代码只是垃圾......
$('.trans_bg').css({"background-position":"0 0"});
$('.trans_bg').hover(
function() {
$(this).animate({backgroundPosition: "(0px -56px)"},{duration:300});
},
function(){
$(this).animate({backgroundPosition: "(0px 0px)"},{duration:300});
})
有什么想法吗？
最佳答案
您的代码几乎是正确的，只需在设置新位置时删除括号即可:
$('.trans_bg').css({ backgroundPosition: "0 0" });
$('.trans_bg').hover(function() {
$(this).animate({ backgroundPosition: "0px -56px"}, 300);
}, function() {
$(this).animate({ backgroundPosition: "0px 0px"}, 300);
});
但不幸的是，jQuery 无法原生设置背景位置动画。
但是有一个很棒的插件可以做到这一点:Background-Position Animation Plugin .
将其抓取到您的项目中，以便键入的代码开始工作!
关于jquery - 动画背景未按预期工作，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/5951827/