Wednesday, 15 January 2014

menu - Submenu in wordpress -


I already have a menu, now I am creating submenu and I need simulators effect on this site: / P>

    > pre & lt; & Lt; Li & gt; & Lt; A href = "#" & gt; Item & lt; / A & gt; & Lt; / Li & gt; & Lt; Li & gt; & Lt; A href = "#" & gt; Item & lt; / A & gt; & Lt; Ul class = "sub-menu" & gt; & Lt; Li & gt; & Lt; A href = "#" & gt; Submenu & lt; / A & gt; & Lt; / Li & gt; & Lt; Li & gt; & Lt; A href = "#" & gt; Submenu & lt; / A & gt; & Lt; / Li & gt; & Lt; / Ul & gt; & Lt; / Li & gt; & Lt; Li & gt; & Lt; A href = "#" & gt; Item & lt; / A & gt; & Lt; / Li & gt; & Lt; Li & gt; & Lt; A href = "#" & gt; Item & lt; / A & gt; & Lt; Ul class = "sub-menu" & gt; & Lt; Li & gt; & Lt; A href = "#" & gt; Submenu & lt; / A & gt; & Lt; / Li & gt; & Lt; Li & gt; & Lt; A href = "#" & gt; Submenu & lt; / A & gt; & Lt; / Li & gt; & Lt; / Ul & gt; & Lt; / Li & gt; & Lt; Li & gt; & Lt; A href = "#" & gt; Item & lt; / A & gt; & Lt; / Li & gt; & Lt; / Ul & gt;

    Structure:

    Menu functions:

    • The sub menu only appears when clicked on the parent menu
    • Background

Please show me any direction to me, how do I need to style it or use some script P>

Wordpress, by default, all & lt; Li & gt; A class of sub items "menu-" Kids item-is.

First of all, we will hide sub menu with CSS.

  .sub-menu {display: none;}  

Then with jQuery, we add a click function and .slideToggle to change the style display: block; and parents & lt; Li & gt; 's & lt; A & gt; Add a slide open / close effect when clicked.

  $ ('menu-item-has-kids'). Children ('a'). ('Click', function (event) {event.preventDefault (); $ (this) .next ('sub-menu'). SlideToggle (100) .end () .Parent ('menu item- Children-have '). Sister (' menu item-is-children ') Children (' A ') Next (' sub-menu ') SlideUp (100);});  

This is mine.

Here.


No comments:

Post a Comment