1

コンテンツを div に動的にロードするスクリプトを作成し、コンテンツが div の高さを大きくしたり小さくしたりするたびに、高さを実際の高さにアニメーション化します。

問題は、上下にスライドするだけでなく、常に少し上にスライドしてから、目的の高さまで下にスライドすることです。

「跳ねる」ことなく、希望の高さで直接スライドさせたいです。

以下はスクリプトの一部です: main_content.html(html);

main_content.css("height", "auto");
var newContentHeight = main_content.height();
loader_div.hide();
main_content.height(prevContentHeight);
main_content.fadeIn("fast", function() {
    main_content.animate({
        "height": newContentHeight
        }, 300);
    });

スクリプトは機能します。唯一の問題は、アニメーションが div を目的の高さまで上下にスライドさせないことです。常に少し上にスライドさせてから、目的の高さまで下にスライドさせます。

アニメーションの高さを使用するときに必要なアニメーションですか、それとも何か問題がありますか? ありがとう

編集: newContentHeight(div の最終的な高さ) を記録するコンソールは、2 つの高さを収集するように見えます。次に、アニメーションが最初にそれらの 1 つに移動し、次にもう 1 つに移動するため、バウンスのように見えます。それに取り組んでいます。

edit2: はい、問題は間違いなくあります。すべてのコードをクリーンアップし、console.log を使用して newContentHeight から 2 つの属性を取得する以外はすべて機能します。非表示のコンテンツ div には 2 つの高さがあり、それらの 2 つの高さが.animate それが最初に上昇し、次に下降する理由です...ちょっと奇妙です

4

2 に答える 2

1

問題を解決できませんでした。以下のスクリプトを変更しましたが、すべてが正常に機能するようになりました。 http://css-tricks.com/dynamic-page-replacing-content/ それは私が探していた正確なアニメーションを持っています（簡単に実装できるいくつかのステップを除いて）。

于 2012-04-08T15:31:15.597 に答える
1

問題はスクリプトではなく、スクリプトを実行しているシステムだと思います。時間を少し遅くする

main_content.animate({
"height": newContentHeight
}, 3000);
于 2012-04-06T12:40:41.707 に答える