Question

J'ai un div qui reçoit le contenu d'un appel ajax. En ce moment je suis en train de faire tout cela dans le gestionnaire de rappel ajax:

function searchCallback(html) { $("#divSearchResults").html(html); }

Cela rend le contenu « pop » sur la page, et il est très abrupt. Y at-il un moyen de faire la div redimensionne avec grâce, comme la méthode .slideToggle () fait?

Était-ce utile?

La solution

Vous pourriez avoir caché pour commencer. Ensuite, insérez le code html et quand cette fonction est fait, faire un effet de spectacle sur elle. (Comme votre slideToggle)

Autres conseils

Assurez-vous que son caché, puis ajouter le contenu et faites simplement glisser dans.

$("#divSearchResults").hide();
$("#divSearchResults").html(html);
$("#divSearchResults").slideDown();

Ou vous pouvez effacer dans:

$("#divSearchResults").fadeIn();

Pour vous assurer que votre page ne pas « exploser » lorsque le contenu apparaît, assurez-vous que la div est caché à être avec. Aussi, assurez-vous qu'une fois le contenu est ajouté, la page semble bien.

Je ne sais pas cela fonctionnera, mais la peine d'essayer:

  • En savoir taille actuelle div et réglez fixe.
  • Mise à jour HTML
  • Animer la hauteur et la largeur à "auto".

Bien sûr, vous pouvez essayer ceci:

function searchCallback(html) {
    var html_hidden = $('<div style="display:none;" class="hidden_insert">'+html+'</div>');
    $('#divSearchResults').html(html);
    $('#divSearchResults .hidden_insert').slideDown('medium');
}

Pas la plus jolie chose, mais il travaillerait. Vous pourriez plutôt vers le haut en faisant un style CSS pour la classe « hidden_insert » qui ferait un élément avec cette classe cachée par défaut. En outre, sur votre back-end, où vous envoyez cette date à partir, vous pouvez faire l'emballage il au lieu de votre javascript. Le script pourrait alors être simplifié à quelque chose comme:

function searchCallback(html) { 
    $('#divSearchResults').html(html).find('.hidden_insert').slideDown('medium');
}

Je ne l'ai pas testé l'un de ces mais ils devraient travailler.

Licencié sous: CC-BY-SA avec attribution
Non affilié à StackOverflow
scroll top