jquery - 仅使用 JS 在悬停时显示文本

Question

我尝试了 CSS 解决方案，但不起作用（我相信这是我正在使用的软件或服务器的错误）。现在正在寻找java解决方案。

简而言之，我希望在悬停时显示文本。

这是我想出的，但它不起作用（我是菜鸟）....

<DIV class="spire-menu">
    <DIV class="menu-item">Hello1</DIV>
    <DIV>Hello2</DIV></DIV>

计划是永久显示 Hello2。Hello1 只会在悬停时显示。

$(".spire-menu").hover(function () {
    $(this).find('.menu-item').show();
}, function () {
    $(this).find('.menu-item').hide();
});

Answer 1

CSS is better to use instead of JQuery. But if it doesn't work, here is the JQuery solution

<div class="spire-menu">
    <DIV class="menu-item" style="display:none;">Hello1</DIV>
     <DIV style="position:absolute;top:25px;">Hello2</DIV>
</div>

jQuery:

$(function(){
    $(".spire-menu").hover(function(){
      $(this).find(".menu-item").fadeIn();
    }
                    ,function(){
                        $(this).find(".menu-item").fadeOut();
                    }
                   );        
});

Here's the working Demo

Hope it will work for you.