尝试使主题下拉菜单变为OnClick而不是将鼠标悬停 [英] Trying to make theme dropdown menu OnClick instead of hover

问题描述

[对不起，这对任何人来说都是愚蠢的，管理员要求我将其移至溢出位置]

[Sorry if this is a dup to anyone, I was asked by the admins to move it to overflow]

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

I'm using the DIVI theme and making some relatively simple modifications to it to better suit my needs. One thing I'm having some difficulty with though surprisingly is swapping out its vertical menu's hover state drop downs to onclick functionality.

我在这里整理了下面的代码示例: JSFIDDLE

I've put together an example of the code below here: 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

Oddly, though I can't seem to remove the hover state functionality from the menu. An example of DIVI can be found here: DIVI

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

Note: You'll need to go to headers in the navigation and choose the dark vertical navigation to replicate my layout.

提前感谢您的想法！

推荐答案

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

The theme developer produced a result that produced the required result. The alteration to swap the functionality of the page navigation of DIVI is done in a file titled frontend-builder-scripts.js found in the DIVI folder directory /includes/builder/scripts/frontend-builder-scripts.js

要更改悬停以单击，请将第1074行(下面的顶行)中的以下代码从.hover交换为.click.

To alter the hover to click swap the following code found on line 1074(Top line below) from .hover to .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;
}

这篇关于尝试使主题下拉菜单变为OnClick而不是将鼠标悬停的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！