使用jQuery动画切换背景图像

当用户将鼠标悬停在div上时，我使用下面的代码更改了背景图像

$(document).ready(function(){
$("#f1_container2").hover(function(){
    $(".photobg").fadeIn( 800);
},
function(){
    $(".photobg").fadeOut(800);
});
 });

这很好，但如果用户仍在该div上悬停，我希望背景图像再次更改（比如说，2秒钟内）。我尝试了下面的代码

$(document).ready(function(){
$("#f1_container2").hover(function(){
    $(".photobg").delay(2000).animate({"background":"#000 url(space-image.png) center    center fixed no-repeat"}, 0);
}),
 });

---

这是错误的…还是我应该使用像延迟淡入一个具有不同背景的新背景div这样的方法。

我没有任何运气尝试在hover函数中移动setInterval。参见上文var imgSrc=“space image.png”；我没有任何运气尝试在悬停函数中移动setInterval。参见上文var imgSrc=“space image.png”；

$(document).ready(function(){
 var imgSrc = "space-image.png";
 $("#f1_container2").hover(function(){ setInterval($(".photobg").fadeOut('2000', function(){$(".phtobg").css("background-image", "url(" + imgSrc + ")"); }).fadeIn(), 1000);});
});