Hide And Show List Menu Items Using JQuery

Question

I have simple vertical menu using list elements like below

Home

Solution 1:

You constantly reload page - and the javascript reloads too. If you want to save the state of the menu between requests use cookies.

Or here is a version without reloading the page - then you have to use Ajax.

<script type="text/javascript">
$(document).ready(function() {

    $('#left-navigation a').click(function(){
     return false;
    });

    $(".parent-grapes > a, .parent-apples > a, .parent-dry-fruits > a").click(function () {
    var $block = $(this).parent().find(".sub-menu");
    $block.toggle();

    $.get($(this).attr('href'), function(data){
      $('#main-content').html($(data).find('#main-content').html());
    });
    return false;
    });
});
</script>

The menu requires only this javascript (and JQuery)

Solution 2:

  <script type="text/javascript">
      $(document).ready(function() {
         $("#apples > a").on('click',function(e){
            $('#apples .subMenu ').toggle();
            return false;
         });
      }); 
   </script>

http://jsfiddle.net/makedone/WRcBa/

Baca Juga

Solution 3:

try this. It worked for me..

Thanks! @leo.

 <script type="text/javascript">
      $(document).ready(function() {
            hideAll();

             $("#leftNav li a").click( function(e) {
               try {

                  var pid = $(this).parent('li').attr("id");
                  //alert(pid);
                  if(pid == undefined) {

                  } else {
                    hideAll();
                    $("#" + pid + " .submenu").show();
                    e.preventDefault();
                  }

               } catch(e) {
                alert("oops!");
               }
            });
        }); 


        function hideAll() { 
             $(".subMenu").hide();
        }

  </script>

Html5 Academy

Hide And Show List Menu Items Using JQuery

Solution 1:

Solution 2:

Solution 3:

Post a Comment for "Hide And Show List Menu Items Using JQuery"