jquery - Jquery - 在 mouseenter / mouseleave 上缓和过渡

Question

初学者在 Jquery 中尝试一些我认为很简单的东西？？？已经尝试了几个小时的各种事情（淡入淡出，动画，切换幻灯片，缓动等），但无法让它工作..

基本上有一个值，当你将鼠标悬停在它上面时，值会发生变化，这就是我工作得很好。但目前这种转变非常突然。我想要实现的是一些缓和以创建更平滑的过渡？

有小费吗？

http://jsfiddle.net/w7q0bug9/

$(function() {

$('#test').mouseenter(function() {
    $('#test').text('hallo');
 });

$('#test').mouseleave(function() {
    $('#test').text('...');
 });

});

我为这个问题简化了我的问题，我在 webflow 网站中使用它来在选择 svg 时在某处显示文本值，这是我最终要应用它的代码

$('.SVGimage').mouseenter(function() {
    $('.TextToChange').text( $(this).attr('TextValueFromSVG'));
 });

Answer 1

得到朋友的帮助：

        $(".SVGimage").mouseenter(function () {
      const textValue = $(this).attr("TextValueFromSVG");
      $(".TextToChange")
        .fadeOut(function () {
          $(this).text(textValue);
        })
        .fadeIn();
    });