jQuery onclick addclass/removeclass et ajouter fade

Depuis trois jours, j'ai été la recherche d'une solution à mon problème. J'ai vu beaucoup de gens avec la même question que j'ai, mais pas une solution résout mon problème. Donc je suis de nouveau là où j'ai commencé et je demande de l'aide de vous des gens sympathiques!

J'ai maintenant le script suivant la course, qui fonctionne parfaitement pour moi:

$(".show_commentsandnotes_container").click(function () {
    $('.commentsandnotes_bg').addClass('show');
    $('.commentsandnotes_container').addClass('show');
});
$(".commentsandnotes_bg").click(function () {
    $('.commentsandnotes_bg').removeClass('show');
    $('.commentsandnotes_container').removeClass('show');
});

La seule chose que je ne peux pas travailler, est la décoloration et d'éléments. J'ai essayé beaucoup de solution comme la bascule et de montrer/cacher, mais ce qui fonctionne le mieux pour moi. La seule chose que j'ai besoin est que la décoloration est ajouté au script (1000 ms), je ne peux pas travailler que.

Quelqu'un peut m'aider? Merci à l'avance.

Faire la montrer et cacher les classes de déterminer la propriété d'affichage?
Oui, désolé. Les classes: commentsandnotes_container et .commentsandnotes_bg avoir un display: none. Et la classe .un spectacle qui a display: block.
Sont-ils utilisés pour autre chose que la propriété d'affichage? sucha comme dans l'autre élément de code?

OriginalL'auteur Sodj | 2014-05-01

  1. 4
    $(".show_commentsandnotes_container").click(function () {
    $('.commentsandnotes_bg').fadeIn(1000, function() {
       $('.commentsandnotes_bg').addClass('show');
    });
    $('.commentsandnotes_container').fadeIn(1000, function() {
       $('.commentsandnotes_container').addClass('show');
    });
});
$(".commentsandnotes_bg").click(function () {
    $('.commentsandnotes_bg').fadeOut(1000, function() { 
       $('.commentsandnotes_bg').removeClass('show');
    });
    $('.commentsandnotes_container').fadeOut(1000, function() { 
       $('.commentsandnotes_container').removeClass('show'); 
    });
});

    Comme une note de côté, pour des scénarios plus complexes, plus contrôlable alternative est d'utiliser jQuery.animate(). Juste être sûr de vraiment regarder dans la documentation et de savoir exactement ce que vous voulez avant de vous plonger dans cet. Il est beaucoup plus souple, mais pas aussi simple.

    Par exemple, un non testé version de la première partie du code fourni dans la question :

    $( "#show_commentsandnotes_container" ).click(function() {
  $("#commentsandnotes_bg" ).animate({
    opacity: 0.25,
    height: "toggle"
  }, 1000, function() {
     $("#commentsandnotes_bg").addClass("show");
  });
});
    WOW, merci beaucoup! C'était tellement rapide, exactement ce que je cherchais! Grâce à vous j'ai enfin compris comment cela doit être fait (au bout de trois jours à essayer). Vous sir un vrai gentleman 🙂
    Vous êtes les bienvenus. ive a frappé la même question à quelques reprises, compliqué et beaucoup plus à la recherche de cette réponse. 🙂 Je suis content d'avoir pu aider quelqu'un à un problème que j'ai déjà trouver

    OriginalL'auteur Brett Weber