jquery - hoverIntent with Foundation 5 Menu -
i trying implement hoverintent zurb foundation 5 dropdown menus. issue foundation menus firing on hover. causes issues when using mega menus.
i can see event triggers because of color change dosn't effect timing of hovering state mega visible.
example can viewed at.. foundation.myplumbingshowroom.com/testing.html
<script type="text/javascript" charset="utf-8"> $(document).ready(function(){$(".hovering").hoverintent(hoverin,hoverout)}); function hoverin(){$(this).attr("data-options","is_hover:true").css('color', 'red');} function hoverout(){$(this).attr("data-options","").css('color', 'white');} </script> <li class="hide-for-medium-down"><a class="hovering" aria-expanded="false" href="#" data-dropdown="menu-1" data-options="is_hover:true" ><strong>ceiling lights</strong></a> <div aria-hidden="true" style="position:absolute" id="menu-1" data-dropdown-content="" class="mega f-dropdown content row"> <div class="row"> <div class="small-3 columns"><img src="http://placehold.it/800x550&text=image" alt=""/></div> <div class="small-3 columns"> <ul> <li><label>heading 1-1</label></li> <li><a href="#">link 1</a></li> <li><a href="#">link 2</a></li> <li><a href="#">link 3</a></li> <li><a href="#">link 4</a></li> </ul> </div> </div> </div> </li>
Comments
Post a Comment