尝试使用主题下拉菜单OnClick而不是悬停

Question

[对不起如果这对任何人来说都是重复的,管理员会要求我将其移至溢出]

我正在使用DIVI主题并对其进行一些相对简单的修改以更好地满足我的需求.有一件事我遇到了一些困难,但令人惊讶的是将其垂直菜单的悬停状态下拉到了onclick功能.

我在下面汇总了下面代码的示例:JSFIDDLE

$('ul.top-menu').children('.menu-item-has-children').click(function(){
    $(this).children('.sub-menu').slideToggle('slow');
}).children('ul').find('.menu-item').click(function (event) { //select all the `.child` elements and stop the propagation of click events on the elements
    event.stopPropagation();
    return false;
});

奇怪的是,虽然我似乎无法从菜单中删除悬停状态功能.DIVI的一个例子可以在这里找到:DIVI

注意:您需要转到导航中的标题,然后选择深色垂直导航来复制我的布局.

提前感谢您的想法!

Answer 1

主题开发人员产生了产生所需结果的结果。交换 DIVI 页面导航功能的更改是在 DIVI 文件夹目录 /includes/builder/scripts/frontend-builder-scripts.js 中名为 frontend-builder-scripts.js 的文件中完成的

要将悬停更改为单击，请将第 1074 行（下面顶行）中的以下代码从 .hover 更改为 .click。

$et_top_menu.find( 'li' ).hover( function() {
     if ( ! $(this).closest( 'li.mega-menu' ).length || $(this).hasClass( 'mega-menu' ) ) {
     $(this).addClass( 'et-show-dropdown' );
     $(this).removeClass( 'et-hover' ).addClass( 'et-hover' );
            et_menu_hover_triggered = true;
}

到

$et_top_menu.find( 'li' ).click( function() {
     if ( ! $(this).closest( 'li.mega-menu' ).length || $(this).hasClass( 'mega-menu' ) ) {
     $(this).addClass( 'et-show-dropdown' );
     $(this).removeClass( 'et-hover' ).addClass( 'et-hover' );
            et_menu_hover_triggered = true;
}