slideToggle Fonction jQuery

Question

J'essaie d'afficher un paragraphe de texte, puis en dessous se trouve un lien "lire plus", quand je clique sur le lien, plus de texte est censé glisser et le texte du lien est supposé lire « Lire moins », puis quand ils cliquent que le texte est censé glisser vers l'arrière et le texte de lien à « Lire la suite » à nouveau ..

$('#more').click(function() { 
       $('#the_more').slideToggle("slow", function() { 
         $('#more').html("Read Less"); 
        }); 
}); 

toute tache des problèmes?

Answer 1

De mon commentaire:

Eh bien, le libellé est changée dans une seule direction, donc ça va jamais revenir à « En savoir plus ». A part ça, ce serait bien de voir le HTML qui l'accompagne.

Voici un code qui pourrait fonctionner, en attendant de voir le code HTML.

$('#more').click(function() { 
    $('#the_more').slideToggle("slow", function() { 
     $('#more').text(function (index, text) { 
      return (text == 'Read More' ? 'Read Less' : 'Read More'); 
     }); 
    }); 

    return false; 
}); 

Démo: http://jsfiddle.net/yLvms/

Le code fonctionne comme suit.

1. Un événement de clic est lié à l'élément #more lorsque vous cliquez sur la fonction.
2. Lorsqu'il est allumé, l'élément #the_more est glissé vers le haut ou vers le bas, basculé en fonction de son état de visibilité.
3. Un rappel est déclenché après slideToggle() est terminée que le texte change
4. Le texte dans #the_more est modifié en utilisant la variante fonctionnelle de la fonction .text(), cela passe la valeur courante du texte à la fonction de changement.
5. La fonction de texte est simplement un ternary-if qui vérifie la valeur actuelle du texte dans #the_more et si elle est actuellement 'Lire la suite', elle devient 'Read Less' et vice versa, une bascule du texte.

Espérons que ça aide.