Drop Down Menu Not Working

  • Resolved Mitchell

    (@mitchellri)


    10 years, 5 months ago

    Hello! I am learning how to use WordPress and I am having issues with adding a dropdown menu. I have looked at previous solutions and none seem to apply for my case.

    The website I am working on is picturethis.today which uses a theme modified from Modality.

    In the Appearance->Menus section I have a menu with dropdown menus. It is set to the Primary Menu (there is only one option for ‘Theme locations’) and in the HTML you can see that the dropdown options are entered to be included:

    <ul id="menu-main-navigation" class="sf-menu sf-js-enabled sf-shadow"><li id="menu-item-107" class="menu-item menu-item-type-post_type menu-item-object-page current-menu-item page_item page-item-2 current_page_item menu-item-has-children menu-item-107"><a href="http://wordpress.picturethis.today/">Home</a>
<ul class="sub-menu">
	<li id="menu-item-111" class="menu-item menu-item-type-custom menu-item-object-custom current-menu-item menu-item-home menu-item-111"><a href="http://wordpress.picturethis.today/#overview">Overview</a></li>
	<li id="menu-item-313" class="menu-item menu-item-type-custom menu-item-object-custom current-menu-item menu-item-home menu-item-313"><a href="http://wordpress.picturethis.today/#content-boxes-wrap">Features</a></li>
	<li id="menu-item-113" class="menu-item menu-item-type-custom menu-item-object-custom current-menu-item menu-item-home menu-item-113"><a href="http://wordpress.picturethis.today/#examples">Examples</a></li>
	<li id="menu-item-112" class="menu-item menu-item-type-custom menu-item-object-custom current-menu-item menu-item-home menu-item-112"><a href="http://wordpress.picturethis.today/#from-blog-wrap">News</a></li>
	<li id="menu-item-114" class="menu-item menu-item-type-custom menu-item-object-custom current-menu-item menu-item-home menu-item-114"><a href="http://wordpress.picturethis.today/#about">About Us</a></li>
	<li id="menu-item-115" class="menu-item menu-item-type-custom menu-item-object-custom current-menu-item menu-item-home menu-item-115"><a href="http://wordpress.picturethis.today/#contact">Contact</a></li>
</ul>

    If you go to the website you will see that nothing happens when you hover over the ‘Home’ button. Additionally I have tried deactivating all of my plugins, but that did not work either.

    On the other hand, when there is no selected Primary Menu a dropdown menu seems to register on the ‘Home’ button, but it does not work properly. When you hover over the button it shows the dropdown menu, but when you go down to click the option the menu disappears.

    What I want is to have dropdown menus work on the custom menu.

Viewing 1 replies (of 1 total)
  • Thread Starter Mitchell

    (@mitchellri)

    10 years, 5 months ago

    Solved the issue!

    Added this snippet to style.css:

    #site-navigation ul li:hover ul.sub-menu {
	display: inline;
	position: absolute;
	left: 0;
	top: 52px;
	padding: 0;
	z-index: 1000;
	width: auto;
}

    I also solved the issue where once you hover down to the options in the dropdown menu the menu disappears. All you need to do is move the menu closer to the dropdown.

Viewing 1 replies (of 1 total)

The topic ‘Drop Down Menu Not Working’ is closed to new replies.