jQuery 悬停函数

Question

我正在使用 jQuery 和数据属性创建悬停效果。

所以我所做的是在每个图像上放置一些数据属性，然后通过 jQuery 访问它们并将它们存储在一个变量中。然后我访问它们以通过 jQuery 更改图像。但是，我不知道如何在“mouseout”时将其恢复到原来的状态

这是我的 jQuery:

$(document).ready(function(){
    $('img').hover(function(){
        var s = $(this).attr('data-alt-src');
        $(this).attr('src', s);
    }, function(){
        $(this).attr('src');
    });
});

有什么想法吗？

Answer 1

尝试将原始 src 设置为其他属性并在鼠标离开时使用它。

 $(document).ready(function(){
    $('img').hover(function(){
        var s = $(this).attr('data-alt-src');            
        $(this).attr('orSrc',$(this).attr('src')).attr('src', s);
    }, function(){
        $(this).attr('src',$(this).attr('orSrc'));
    });
});

Demo