jquery - jquery在悬停时为背景设置动画

Question

我不是 jquery 的专业人士，但我一直在搜索并做一些代码来执行以下操作

我需要一个悬停动画来替换一些悬停效果的图像（asd.png 到 asd-hover.png），这是我写的，但仍然需要一些东西来替换这两种方法（替换、匹配）

$(document).ready(function(){ 
    var effect = $('a.dribble')
    effect.mouseover(function(){
        var bg = effect.attr('src').match('/[^\.]+/') + '-hover.png';
        $(this).stop().animate({
            background: bg ,
            duration:500
        })  
        console.log('in')       
    })
    .mouseout(function(){
         var bg = effect.attr('src').replace("-hover.png", ".png");
        $(this).stop().animate({
            background: bg + '-hover.png',
            duration:500
        })
        console.log('out')  
    })
});

有什么帮助吗？！？！？

Answer 1

动画仅用于数值。给 JQuery 两个背景图像（字符串），它将无法对它们做任何事情。你最好让两个元素有自己的背景图像，用 CSS 位置将一个放在另一个之上——然后让顶部的一个淡入淡出。