2

I want to toggle a div#featuredout using a button .featToggle and I want the browser to remember via cookies whether the div#featuredout should be hidden or shown. If possible, I'd like it to be so that if #featuredout is hidden, .featToggle should have an additional class of "hidden" and if #featuredout is shown, .featToggle should have an additional class of "shown".

I'm very very inexperienced with Javascript so any help would be great.

This is my current code:

$(document).ready(function() {
    // When the toggle button is clicked:
  $('.featToggle').click(function() {
  $('#featuredout').slideToggle(550);
    var featuredoutC = $.cookie('featuredout');
    if (featuredoutC == null) {$.cookie('featuredout', 'expanded');};
    else if (featuredoutC == 'expanded') {$.cookie('featuredout', 'collapsed');};
  });
});
// COOKIES
    // state
    var featuredout = $.cookie('featuredout');
    // Set the user's selection for the left column
    if (featuredout == 'collapsed') {
        $('#featuredout').css("display","none");
        $.cookie('featuredout', 'collapsed');
    };
});
Madara's Ghost
  • 172,118
  • 50
  • 264
  • 308
Arkuen
  • 349
  • 1
  • 2
  • 9
  • I've answered a similar question on that a while ago, can't seem to find it though. Use the search, you're bound to find something similar! – Madara's Ghost Sep 03 '11 at 06:26
  • @Rikudo sounds like I'll have to go through all your answers, thanks, I'll try my luck at finding it. – Arkuen Sep 03 '11 at 06:28
  • Also, you ARE using the cookie plugin are you? (it will obviously not work without that) – Madara's Ghost Sep 03 '11 at 06:30
  • @Rikudo Yes I am. Using the code I posted, the div won't even toggle unless I remove lines 5-7. So I am trying to figure out how to set the cookie. – Arkuen Sep 03 '11 at 06:33
  • possible duplicate of [jQuery Toggle with Cookie](http://stackoverflow.com/questions/2523189/jquery-toggle-with-cookie) – Madara's Ghost Sep 03 '11 at 06:34

1 Answers1

0

Something along the lines of this should work 

$(function() {
    $('.featToggle').click( function() {
        $('#featuredout').slideToggle(550);

        $.cookie('featuredout',$('#featuredout').is(':visible'););
    });

    var vis = $.cookie('featuredout');

    if(vis) {
        $('.featToggle').removeClass('hidden').addClass('shown');
    } else {
        $('#featuredout').hide();
        $('.featToggle').removeClass('shown').addClass('hidden');
    }
});
jyore
  • 4,715
  • 2
  • 21
  • 26