foundation 4 section vertical nav flyout menu on mouseover

Question

I am trying to test out zurb foundation 4 css framework. If zurb's web site foundation 4 doc, it mentions foundation 4 uses sections to replace accordion, tabs and vertical nav and & nav bar of old foundation 3. But I couldn't find how to make the vertical nav on mouseover; I have to click on the title. How can I make the vertical nav a flyout menu on mouseover? Mouseover is pretty standard approach, I hope there is simple way to turn it on in foundation 4.

Answer 1

You can set data-options="is_hover" on your dropdown target to enable hover.

Check this link Add hover state support for dropdowns by setting is_hover data-options.

Answer 2

currently

data-options="is_hover:true" 

Is not support to section. You must use custom js to make it work.

Let's try

$(".section").mouseenter(function(){
    $(this).toggleClass("active");
});