将淡入淡出添加到此jQuery滚动显示

Add fade to this jQuery rollover

本文关键字：jQuery 滚动 显示 淡入 淡出 添加      更新时间：2023-09-26

我该如何为这段jQuery添加渐变或动画化不透明度的变化？

感谢

<script  type='text/javascript'>
$(document).ready(function(){
    $(".alain").hover(
        function() {$(this).attr("src","images/rollovers/alain-rollover.png");},
        function() {$(this).attr("src","thumbnails/alain-thumbnail.jpg");
    });
});
</script>

淡出图像，更改来源，将图像淡入：

$(document).ready(function(){
    $(".alain").on('mouseenter mouseleave', function(e) {
        var src = e.type == 'mouseenter' ? 'images/rollovers/alain-rollover.png' : 'thumbnails/alain-thumbnail.jpg';
        $(this).fadeOut('slow', function() {
            $(this).prop('src', src).fadeIn('slow');
        });
    });
});

jsbin

如果旧的浏览器不是问题，那么添加和删除带有CSS3转换的类似乎更容易。

相关文章：