1

私は JQuery アニメーションを初めて使用します。これは比較的単純な質問のように思えますが、掘り下げてみたところ、他の場所で解決策が見つかりません。

特定のパーセンテージの高さに設定したい親divがあります。

$('#parent').animate({
    height: "75%"
});

親の高さの 100% にしたい子 div があります。

2つを同時にアニメートする最良の方法は何ですか?親をアニメートすることにした高さ、50%、30%、22.937%に関係なく、子は親の高さの100%のままですが、横に成長/縮小します親?

ここにフィドルがあります:http://jsfiddle.net/azw2F/2/

パーセンテージを破棄し、コンテナの高さから高さがピクセル単位でどうなるかを把握し、親と子を同じピクセル値にアニメーション化できると思いますが、もっと簡単な方法はありますか?

ありがとう、アダム

編集

この問題は、子 div が親のディメンション内に配置されているかどうかに関連しているようです。ディメンションの外側にある子 div の部分はアニメーション化されません。アニメーションが終了すると、最後に「ポップ イン」するだけです。

親内の子: http://jsfiddle.net/azw2F/9 部分的に親の外にある子: http://jsfiddle.net/azw2F/10

親が代わりに兄弟になるように、HTMLをおそらく再構築する必要があると思います。それが唯一の答えかもしれません(ピクセルの計算について私が言ったこと以外)。私が知らなかった JQuery アニメーションの魔法があることを願っていたのだと思います。

4

2 に答える 2

2

最善の解決策はこれでした: http://jsfiddle.net/azw2F/11/

overflow:visible!important;子 div が部分的に外側にある場合、つまり子 div が親からオーバーフローしている場合、親 div に追加します。考えてみれば驚くほどシンプル!

于 2013-05-14T08:03:03.173 に答える
1
I have two solution for your problem

with position:absolute子供の最初のもの

http://jsfiddle.net/azw2F/4/

without position:absolute私が以前に投稿した子供の2番目のもの

http://jsfiddle.net/azw2F/3/

于 2013-05-01T14:53:55.953 に答える