Toggle two divs and classes
        Posted  
        
            by kuswantin
        on Stack Overflow
        
        See other posts from Stack Overflow
        
            or by kuswantin
        
        
        
        Published on 2010-04-15T12:14:08Z
        Indexed on 
            2010/04/15
            12:33 UTC
        
        
        Read the original article
        Hit count: 333
        
I have two links with classes (login-form and register-form) relevant to their target forms ID, they want to toggle. I have also a predefined 'slideToggle' function to toggle better.
This is what I have tried so far:
$('#userbar a').click(function() {
      var c = $(this).attr('class');
      $('#userbar a').removeClass('active');
      $(this).toggleClass('active');
      $('#register-form,#login-form').hide(); //bad, causing flashy
      $('#' + c).slideToggle('slow');
        return false;
    });
With this I have trouble with the flashy window, and to correctly toggle the active classes when another link is clicked, the other link should not have active class anymore. Additional problem is the link is dead on serial clicks.
I have another try, longer one:
$('#userbar a').click(function() {
      var c = $(this).attr('class');
        switch (c) {
        case 'login-form':
            $('#' + c).slideToggle('slow');
            $(this).toggleClass('active');
            $('#register-form').hide();
            break;
        case 'register-form':
            $('#' + c).slideToggle('slow');
            $(this).toggleClass('active');
            $('#login-form').hide();
            break;
        }
        return false;
    });
This one is worse than the first :(
Any suggestion to correct the behavior?
What I want is when a link with class login-form is click, so toggle the form with ID login-form, and hide the register-form if open.
Any help would be very much appreciated. Thanks.
© Stack Overflow or respective owner