jQuery fadeOut, replaceWith, animer presque fonctionne

J'essaye d'accomplir ce qui suit: 1. Sur le clic, ayez un div avec id = "fader" fadeout 2. replaceHtml de fader avec le nouveau html (ce nouveau HTML apparaîtra sous le pli du navigateur) 3. Animez le nouveau HTML pour le faire glisser jusqu'à l'emplacement spécifiéjQuery fadeOut, replaceWith, animer presque fonctionne

Les étapes 1 et 2 fonctionnent, l'étape 3 ne fonctionne pas et je suis perplexe quant à savoir pourquoi.

Voici le javascript:

$("#fader").fadeOut(1000, function() { 
    $(this).replaceWith('<div id=\"fader\" style=\"margin-top:-500px;width:500px;height:400px;border:1px solid black;\">new div</div>', function() { 
    $("#fader").animate({marginTop: "500px"}); 
    }); 
});

Toute réflexion sur pourquoi le div n'animer serait grandement apprécié, merci à l'avance!

Source

2010-03-17 Anonymous

@Jesse - Si vous le pouvez, acceptez les réponses en cliquant sur la coche à côté de la case qui vous a aidé à résoudre le problème, aidez à garder les choses bien rangées et vos questions à répondre. –

Essayez aussi ma fonction .. faites le moi savoir! ;-) –

Dans votre cas .replaceWith() n'a pas de rappel, il a une signature différente de celle des animations.

Essayez ceci:

$("#fader").fadeOut(1000, function() { 
    $(this).replaceWith('<div id="fader" style="margin-top:-500px;width:500px;height:400px;border:1px solid black;">new div</div>'); 
    $("#fader").animate({marginTop: "500px"}); 
});

Notez que vous ne pouvez pas la chaîne ce, .replaceWith() renvoie l'objet d'origine , pas celui que vous venez de créer.

Source

2010-03-17 20:19:22

Merci pour la clarification sur .replaceWith() et le chaînage. L'extrait de code que vous avez fourni fonctionne, j'apprécie beaucoup votre aide! –

Je suis confus à propos de ce que vous dites: 1) .replaceWith() n'a pas de rappel, point; pas seulement dans ce cas. Et 2) Il n'enchaînait rien dans son code initial (à moins qu'il n'ait édité le code avant de l'avoir vu). Le chaînage est comme '$ ('. Class'). ReplaceWith ('

') .fadeIn();', ou ai-je tort? – dclowd9901

@ dclowd9901 - Si vous avez supprimé '$ (" # fader ")' dans $ ("# fader"). Animate ({marginTop: "500px"}); 'alors cela ne marcherait pas ... normalement vous peut raccourcir par le même sélecteur, je soulignais que la suppression de ce sélecteur dans ce cas ne fonctionnera pas, alors n'essayez pas d'optimiser cela :) –

jQuery fadeOut, replaceWith, animer presque fonctionne

Répondre

Questions connexes