JQuery在Dover和New Div Stays上显示DIV

Question

我目前有一个带有class =“toggle-drop2”的DIV，其中包含文字“VIEW MORE”

在这个DIV下是另一个ID =“category-drop”的DIV

使用当前的JQuery：

jQuery('document').ready(function(){
jQuery(".toggle-drop2").hover(function () {
$this = jQuery(this);
$this.hasClass('open') ? ($this.removeClass('open')) : $this.addClass('open');
jQuery('#category-drop').slideToggle();
});
});

当您将鼠标悬停在“toggle-drop2”DIV上时，会出现“category-drop”DIV。现在有谁知道如果我将鼠标悬停在它上面，我怎么能让“类别掉落”DIV停留？

现在如果我将鼠标悬停在“类别掉落”DIV上，DIV就会消失。

HTML就是这样：

<div id="toggle-drop-link-container" align="center">
<a href="#" class="toggle-drop2">ALL ITEMS</a>
</div>

<div id="category-drop">
Something here
</div>

Answer 1

嵌套元素：

<div class="toggle-drop2">
    <div id="category-drop">
        <!-- dropdown content -->
    </div>
</div>

JS

jQuery(document).ready(function($){
    $(".toggle-drop2").hover(function () {
      $(this).toggleClass('open');
      $('#category-drop').slideToggle();
    });
});