Question

我正在编写自己的简单下拉菜单......但它并不是那么顺利。

我只需要悬停在列表中的直接子项向下滑动。

此外，如果用户在链接或子菜单上，它需要保持不变。

感谢您的帮助!!!

我的基本HTML：

            <ul>
                <li class="media drop-down"><a href="#">Link</a>
                    <ul class="sub-menu">
                        <li>
                        This is stuff!
                        </li>
                    </ul>
                </li>
            </ul>

我的jQuery

$('.sub-menu').hide();
var menu = $('.drop-down').children('ul');
var down = function (x) {menu.stop().slideDown(); }
var up = function (x) {menu.stop().slideUp(); }
$("li.drop-down").hover(down, up);//show/hide buttons

Answer 1

这应该这样做 - 请注意上下文作为$的第二个参数。

$('.sub-menu').hide();
var down = function (x) {$('ul.sub-menu', this).stop().slideDown(); }
var up = function (x) {$('ul.sub-menu', this).stop().slideUp(); }
$("li.drop-down").hover(down, up);//show/hide buttons

Answer 2

这一行

var menu = $('.drop-down').children('ul');

返回一组所有ul元素，这些元素是具有“drop-down”类的元素的直接子元素。您可能想要做的是在每个向上和向下功能中包含以下内容：

var menu = $(this).children('ul');

jQuery下拉问题

2 个答案: