Question

我已经在WordPress中使用自定义下拉功能很多小时了，但我无法弄清。

我一直在使用this function创建我的自定义下拉菜单。这是我到目前为止得到的：https://jsfiddle.net/uqsz7f4k/1/

let menuLink = $('a.menu__link');

menuLink.hover(function(){

  let mainMenu = ('ul.menu__level[data-menu="main"]');
  let menuTrace = $(this).data('trace');
  let subMenuId = $(this).data('submenu');
  let subMenu = $('ul.menu__level[data-menu="' + subMenuId + '"]');

  $('ul.menu__level[data-trace][data-trace!="' + menuTrace + '"]').hide();

  subMenu.fadeIn();

});

如您所见，我试图在子菜单和父链接上创建一个“跟踪”（数据跟踪），以使悬停函数（jQuery）记住上一级，因此它关闭了所有级别，但主要级别和相关子级别。但是我宁愿只使用普通CSS即可获得所需的结果，而不必执行此跟踪工作。

当您将鼠标从父链接移动到给定的子菜单时，我也希望子菜单不消失。

这是做我想要的更好的方法吗？我不能在子菜单上使用position：absolute，因为它会破坏我的布局，因此我需要使用float。

如果没有更好的方法，您是否知道如何修改上面的自定义wp_nav函数，以在子菜单和具有顶级父项的父链接上输出data-trace =“”属性？

我想获得的最终结果是当您按下“ Alle produkter” /“所有产品”时在Komplett.no上的下拉列表。

希望我能很好地解释，您可以为我提供帮助：）

最诚挚的问候

如何解决我的自定义WordPress下拉菜单问题（悬停功能）

0 个答案: