fadeOut div dopo problema evento onClick

Question

questo è il mio primo post volta qui e ho letto un sacco di cose utili nelle ultime settimane da quando ho trovato il sito!

Quindi, la mia domanda è: ho il seguente codice sul mio sito e quello che im cercando di fare è ...

• Quando si fa clic su un elemento (.btn-leavecomment),

• un div nascosti (#commenttype) viene rivelata tramite slideDown. Questo div nascosti contiene due pulsanti di opzione.

• Al clic / selezione del pulsante 'prima' della radio (.reveal_ccform) Vorrei un altro div nascosti per essere rivelata (ho tutto questo lavoro fino a qui)

• che avevo allora come il div prima nascosta (che contiene i pulsanti di opzione (#commenttype)) per poi scomparire e fadeOut una volta che l'utente ha selezionato solo il primo pulsante di opzione dei due. Il secondo pulsante

  (radio redirect ad un'altra pagina nel caso ve lo stiate chiedendo.)

Chiunque può aiutare con ottenere quest'ultimo punto (a fadeOut il div prima nascosto) sul clic del pulsante prima radio?

Grazie

Il mio codice:

$(document).ready(function(){

  // Click first element (.btn-leavecomment)
  // and reveal first hidden DIV (#commenttype)
  $(".btn-leavecomment").toggle(function(){   
        $("#commenttype").stop().animate({ down: "+=300" }, 3000)      
        $("#commenttype").stop().slideDown("slow");
   }, function(){
        $("#commenttype").stop().animate({ down: "-=300" }, 1400)      
        $("#commenttype").stop().slideUp("slow");  
  });     


  // on click of first radio (.reveal_ccform)     
  // Reveal second hidden DIV (ccform_container) 
  $(".reveal_ccform").toggle(function(){   
  $("#ccform_container").stop().animate({ down: "+=600" }, 6000)      
  $("#ccform_container").stop().slideDown("slow");    


  //fadeOut #commenttype onClick of .reveal_ccform after #ccform_container slidesDown


}); 

Answer 1

Mi sento come se devo essere perso qualcosa, perché questo sembra abbastanza semplice rispetto a quello che si sta già facendo, ma qui si va:

$('.reveal_ccform').click(function() {
    $('#commenttype').fadeOut();
});

****** EDIT ****

Per una più agevole e animazioni più complesse come per la richiesta nel seguente commento, fare qualcosa di simile:

$('.reveal_ccform').click(function() {
    $('#commenttype').animate({height: 0, opacity: 0}, function() {
        $(this).remove();
    });
});

Questo creerà un'animazione personalizzata per sfumare il div che contiene i pulsanti di opzione e contemporaneamente ridurre l'altezza a zero, che risolverà il problema salto. La funzione di callback rimuove il div dopo l'animazione è completa (non un passo necessario, ma mantiene il DOM in linea con ciò che l'utente sta vedendo).

Vedere il risultato: http://jsfiddle.net/8bCAg/