Question

我想在悬停时显示一些元素并将其隐藏在mouseleave上。我知道这是常见问题，通常是由以下内容制作的：

OverloadedStrings

但这种方式元素.my_text在该动作上闪烁（display：none和block之间的快速变化），即使我有一个鼠标光标在静止位置。元素.show_it的宽度和高度为30px，我也尝试设置z-index的高值，但它没有效果。谁知道哪里有问题？

Answer 1

它应该在HTML中正常工作：

<div class="show_it">Hover over this</div>

<div class="my_text" style="display:none;">And then this will show up</div>

然后使用这个javascript：

$(".show_it").hover( 
    function() { $(".my_text").show(); }, 
    function() { $(".my_text").hide(); } 
);

显示正常工作的

Here's a JSFiddle

Answer 2

   $(document).ready(function() {

   $('.show_it').on('mouseenter', function() {
    $('.my_text').show();
   }).on('mouseleave', function() {
    $('.my_text').hide();
   });

});

使用mouseenter和mouseleave jQuery方法

Jquery在悬停时隐藏/显示元素

2 个答案: