¿Cómo usar jQuery cookie.js para recordar el elemento hide/show?

Question

He encontrado un excelente tutorial sobre cómo mostrar y ocultar cierto div en una página. Obtuve el código funcionando bien, pero me gustaría ampliar es que el show/hide se recuerda en la carga de la página. He buscado una solución jQuery cookie ha sido la respuesta .. si yo sabía cómo escribir el código real que es .. Esto es el fragmento actual:

<script type="text/javascript"> 
jQuery(document).ready(function() { 
// hides the group_desciption as soon as the DOM is ready 
// (a little sooner than page load) 
    jQuery('#group_desciption').hide(); 
// shows the group_desciption on clicking the noted link 
    jQuery('a#slick-show').click(function() { 
jQuery('#group_desciption').show('slow'); 
return false; 
    }); 
// hides the group_desciption on clicking the noted link 
    jQuery('a#slick-hide').click(function() { 
jQuery('#group_desciption').hide('fast'); 
return false; 
    }); 
// toggles the group_desciption on clicking the noted link 
    jQuery('a#slick-toggle').click(function() { 
jQuery('#group_desciption').toggle(400); 
return false; 
    }); 
});</script> 

Cualquier idea de cómo puedo añadir las cookies para recuerda la selección del usuario? Un ejemplo de código sería genial, ya que todavía estoy tratando de captar jQuery/Javascript en general :)

Gracias de antemano :)

Answer 1

debería ser bastante fácil. Al mostrar el div añadir algo de código como:

jQuery.cookie('show_desc', 'yep'); 

... y cuando se oculta el div:

jQuery.cookie('show_desc', 'nope'); 

... y luego en la parte superior de su código en el que tienes :

jQuery('#group_desciption').hide(); 

... cambiarlo a:

var shouldShow = jQuery.cookie('show_desc') == 'yep'; 
if(shouldShow) { jQuery('#group_desciption').show(); } 
else {    jQuery('#group_desciption').hide(); } 

O, alternativamente:

jQuery('#group_desciption')[jQuery.cookie('show_desc') == 'yep' ? 'show' : 'hide'](); 

:)