9
votes

JQuery Changement lisse de innerhtml

J'ai le code ci-dessous en fonction du charme: xxx pré>

mais le problème vient lorsque je dois changer le contenu (le nombre de lignes): p>

div.html('<div>one line replacement</div><div>another line replacement</div><div>third line</div>')

javascript jquery html slideup

2 commentaires

Le problème est-il "trop rapide", ou vous voulez vraiment glisser la ligne en ligne par ligne?

Le problème est qu'il est trop rapide

5 Réponses :

0
votes

Si vous voulez le faire prendre un certain temps, alors:

div.slideDown(numberOfMilliseconds);

0 commentaires

6
votes

Vous pouvez ajouter une étendue invisible au HTML: xxx pré>

puis le fonduer dans: p> xxx pré>

Aller par votre édition, vous pouvez également vouloir envisager: P>

div.slideUp('slow'); // you may want this to be 'fast'
div.html('some other lines');
div.slideDown('slow');

0 commentaires

1
votes

Peut-être que si vous mettez les lignes supplémentaires dans une DIV avec l'affichage: Aucun style, vous pouvez vous arrêter dans cette div, quelque chose comme ceci (code concept non testé): xxx

2 commentaires

Votre réponse est similaire à celle de Daniel

Ouais - on dirait que nous devions tous les deux avoir commenté la même minute exacte :)

0
votes

Thomas mentionné "Stridedown (numberfmilliseconds)". Je l'ai essayé et JQuery's Doc définit la vitesse en millisecondes est le temps nécessaire pour exécuter l'amimation.

Dans ce cas, 1 ligne ou 10 lignes prendront la même quantité de temps pour glisser. Si vous connaissez le nombre de lignes, vous pouvez peut-être ajouter un multiplicateur, par exemple. SDITEDOWN (LINECOUNT * SPEEDINMS)

0 commentaires

2
votes

Une ride sur la réponse de Daniel Sloof:

div.fadeOut('fast', function() {
  div.html(html);
  div.fadeIn('fast');
}

0 commentaires