Hello and welcome to our community! Is this your first visit?
Register
Enjoy an ad free experience by logging in. Not a member yet? Register.
Results 1 to 2 of 2
  1. #1
    Regular Coder
    Join Date
    May 2004
    Location
    The First State
    Posts
    233
    Thanks
    9
    Thanked 0 Times in 0 Posts

    jQuery cookie not working with menu state

    I have a menu that I'd like to keep it's state across the site as opposed to one page and also want the ability to use multiple menus on a page.

    Somehow I can't get the cookie to work at all even with one menu on a single page. Any ideas?

    Code:
    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.1//EN" "http://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd">
    <html xmlns="http://www.w3.org/1999/xhtml">
    <head>
    <meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
    <title>jCollapser Demo page</title>
    <script type="text/javascript" src="scripts/jquery-1.3.2.min.js"></script>
    <script type="text/javascript" src="/scripts/jquery.cookie.js"></script>
    <script type="text/javascript">
    		
    		$(document).ready(function() {
      $('#menu li ul').hide();
      var cookieValue = $.cookie('menuCookie') || '';
      $('#menu > li > h2').each(function(index) {
        var $this = $(this), $checkElement = $this.next('ul'); 
        if (cookieValue.indexOf((index)) > -1) {
          $checkElement.show();
        }
        $this.click(function() {   
          if ($checkElement.is(':hidden')) {
            $checkElement.slideDown();
            cookieValue = cookieValue + index;
            $.cookie('menuCookie', cookieValue);              
          } else {
            $checkElement.slideUp();
            cookieValue = cookieValue.replace(index,'');
            $.cookie('menuCookie', cookieValue);
          }
          return false;
        });
      });
     
      
    });
     
     
     
    </script>
    <style type="text/css">
    .collapse {
        background: transparent url('collapse.gif') no-repeat scroll 0% 0%;
        height: 11px;
        position: relative;
    left: 120px;
        width: 11px;
    }
     
    .expand {
        background:transparent url('expand.gif') no-repeat scroll 0% 0%;
        display:none;
        height:11px;
        position:relative;
     
        width:11px;
    }
    </style>
    </head>
    <body>
     
     
    <ul id="menu">
    <li>
            <h2>About Us</h2>
            <ul class="allLists">
            <li><a href="showcase.html" title="Project showcase">Project showcase</a></li>
              <li><a href="staff.html" title="Who We are">Who We are</a></li>
              <li><a href="location.html" title="Location/Directions">Location/Directions</a></li>
              <li><a href="javascript:;" title="IT WD staff access">IT WD staff access</a></li>
            </ul>
            </li>
        
       <li>
              <h2>IT Related Links</h2>
             <ul class="allLists">
            <li><a href="http://www.it.udel.edu/" title="IT Home">IT Home</a></li>
            <li><a href="http://www.udel.edu/help/" title="IT Help">IT Help</a></li>
            </ul>
            </li>
        
    </ul>
    </body>
    </html>

  • #2
    Regular Coder
    Join Date
    May 2004
    Location
    The First State
    Posts
    233
    Thanks
    9
    Thanked 0 Times in 0 Posts
    no one can offer any help?


  •  

    Posting Permissions

    • You may not post new threads
    • You may not post replies
    • You may not post attachments
    • You may not edit your posts
    •