Menu icon Foundation
Dropdown links unclickable (F-5.2)

I am having trouble with the dropdown. The links are not clickable. I've seen that there have been issues with this in the past. I've tried looking at z-index issues, but doesn't seem to be that. A snippet of my code is below, if it helps. This dropdown is triggered by click now, but would like to make it trigger on hover once this is resolved.

If I need to disable turbolinks - how?

Thanks in advance!

 <nav class="main-menu hide-for-small-only">
        <section class="small-10 columns">
	    <ul class="left inline-list"><li class="divider"></li><li class="menu-item menu-item-main-menu menu-item-home active" id="menu-item-45"><a href="http://buywine.192.168.42.68.xip.io/napa/">Home</a></li>
<li class="divider"></li><li class="menu-item menu-item-main-menu menu-item-browse-wineries" id="menu-item-47"><a href="http://buywine.192.168.42.68.xip.io/napa/browse-wineries/">Browse Wineries</a></li>
<li class="divider"></li><li class="menu-item menu-item-main-menu menu-item-about-napa" id="menu-item-48"><a href="http://buywine.192.168.42.68.xip.io/napa/about-napa/">About Napa</a></li>
</ul>      
	    	    </section>
       
        <section class="small-2 columns hide-for-small-only">
        
         <div class="drop-wrapper">
				<a class="drop-header has-dropdown" data-dropdown="page-drop" href="#">Other Regions<i class="icon-down-micro"></i></a>
				<ul data-dropdown="drop" class="f-dropdown open" id="page-drop" style="position: absolute; top: 35px; left: 19px;">
                		<li><a href="http://google.com">Sonoma</a></li>
		
				<li><a href="http://google.com">Paso Robles</a></li>
		
				<li><a href="http://google.com">Lodi</a></li>
		
				<li><a href="http://google.com">Santa Barbara</a></li>
		
						</ul>
		
        </div>	</section>
	</nav>            

         

dropdowndrop-downfoundation 5 turbolinks

I am having trouble with the dropdown. The links are not clickable. I've seen that there have been issues with this in the past. I've tried looking at z-index issues, but doesn't seem to be that. A snippet of my code is below, if it helps. This dropdown is triggered by click now, but would like to make it trigger on hover once this is resolved.

If I need to disable turbolinks - how?

Thanks in advance!

 <nav class="main-menu hide-for-small-only">
        <section class="small-10 columns">
	    <ul class="left inline-list"><li class="divider"></li><li class="menu-item menu-item-main-menu menu-item-home active" id="menu-item-45"><a href="http://buywine.192.168.42.68.xip.io/napa/">Home</a></li>
<li class="divider"></li><li class="menu-item menu-item-main-menu menu-item-browse-wineries" id="menu-item-47"><a href="http://buywine.192.168.42.68.xip.io/napa/browse-wineries/">Browse Wineries</a></li>
<li class="divider"></li><li class="menu-item menu-item-main-menu menu-item-about-napa" id="menu-item-48"><a href="http://buywine.192.168.42.68.xip.io/napa/about-napa/">About Napa</a></li>
</ul>      
	    	    </section>
       
        <section class="small-2 columns hide-for-small-only">
        
         <div class="drop-wrapper">
				<a class="drop-header has-dropdown" data-dropdown="page-drop" href="#">Other Regions<i class="icon-down-micro"></i></a>
				<ul data-dropdown="drop" class="f-dropdown open" id="page-drop" style="position: absolute; top: 35px; left: 19px;">
                		<li><a href="http://google.com">Sonoma</a></li>
		
				<li><a href="http://google.com">Paso Robles</a></li>
		
				<li><a href="http://google.com">Lodi</a></li>
		
				<li><a href="http://google.com">Santa Barbara</a></li>
		
						</ul>
		
        </div>	</section>
	</nav>            

         
K Lim over 5 years ago

The element in your markup should have an id set to "page-drop", which is the value you assigned to the attribute data-dropdown in the anchor link right above the .

Additionally, you need to add data-dropdown-content as an attribute of the element.