jquery在悬停时动画背景

时间:2013-05-01 10:03:00

标签: jquery css3

我不是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')  
    })
});

任何帮助?!?!?

1 个答案:

答案 0 :(得分:1)

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