title: jQuery Mobile Panel / jQuery Cookies
body: <p>I am creating a jQuery Mobile site (1.4.2) and using panels.  I have set up a script to open the panel on load if the window width is gt 768.  This works fine with the exception of users that close the panel and want to keep it closed while doing certain tasks, so I am thinking of setting a cookie value when they close the panel and only run the script that opens the panel if the cookie is not set.</p>
  
  <p>For my initial script I have the following and all is well - </p>
  
  <pre><code>&lt;script&gt;    
  $(document).on('pageinit', function() {
     var width = $(window).width();
     if(width &gt; 768) {
        $('##bluebuttonsPanel').panel('open');                  
     }
  });
  &lt;/script&gt;
  </code></pre>
  
  <p>Using the jquery cookie plugin I am setting the cookie like this - </p>
  
  <pre><code>&lt;script&gt;
  $(document).on('pageinit', function() { 
     if( $('.ui-panel').hasClass('ui-panel-closed') == true ) {
        $.cookie('panel','is-hidden');
     } else {
        $.cookie('panel','is-visible');
     };
  });
  &lt;/script&gt;
  </code></pre>
  
  <p>Where I am confused is trying to change the value of the cookie when they click the tab for the panel, then if the panel cookie value is set to 'is-hidden', not run the initial open script. So I don't know how to change the value of the cookie on click and test for the condition on the open script...</p>
  
  <pre><code>$('a#tab').click(function () {
     if ($.cookie('panel', 'is-visible')){ ...?
  </code></pre>
  
  <p>Any help will be greatly appreciated!  I hope I am posting this correctly because I haven't posted in a really long time!  TIA!</p>