0
私はdivに小さなアニメーションを書いています:クリックするとフラグが反転します。クリックすると、画像が変更されます。編集オブジェクトwhile animating
HTML:
<div id="lang"></div>
...
<div id="langnl" class="invisible">
<img id="flag" src="en.jpg" onclick="change(-1,'en')"/>
</div>
<div id="langen" class="invisible">
<img id="flag" src="nl.jpg" onclick="change(-1,'nl')"/>
</div>
はCSS:
.footer #lang {
float:right;
width: 30px;
height: 20px;
text-align:center;
}
.footer #lang img {
width: 30px;
height: 20px;
margin: 0px auto;
border-radius: 5px;
}
JS:
if (!flipping) {
flipping = true;
$('#flag').animate({
width: 0,
}, flipTime, function() {
$('#lang').html($('#lang'+lang).html());
}).animate({
width: 30,
}, flipTime, function() {flipping = false;});
}
私の観察結果:第1フラグフリップ作品が、私ので、第二部をアニメーション化しません。 #flagを削除して置き換えます。次のフリップは機能しません。フリップがまだ間違っているからです。
これを解決し、アニメーションを続けるが、divの内容を置き換える方法は?
同じidを使用している2つの要素は良いアイデアではありませんid = "flag" –
実際はひどい考えです。 id属性は、ページ上の要素を一意に識別するものとします。それを行うための別の方法を見つけると私の推測では、それまでにあなたの問題を解決したでしょう。 – Matthew
あなたは大変正しいです。愚かな、私はそれを修正する、私は問題が解決することを望む(私はそう、私はまだアニメーション中にコードを置き換えているとは思わない)。私は知っているとすぐに書きます。 – Hidde