5

Webkit でこのフィドルを開くと、私が話していることが表示されます。

要素のスタイルを最初に指定するときに指定し、次にその最終状態を指定するにはどうすればよいですか?

(@keyframes を使用しなくても) この方法でシングル ステップ アニメーションを完全に指定できるはずですが、この時点で対処しなければならない実装固有の奇妙さがたくさんあるようです。Firefox ではアニメーションが実行されないことに注意してください...

4

2 に答える 2

2

ここで説明されているのと同じ問題のようです:動的に作成された要素への CSS3 移行

それで

$("#one").on('click',function(){
    var word = $("<div style='opacity: 0; height:0'>word</div>");
    $('body').prepend(word); 
    window.getComputedStyle(word[0]).getPropertyValue("top");
    word.css({height: 100, opacity: 1});
});

この場合も機能します: http://jsfiddle.net/wWnnH/3/

于 2012-07-15T08:05:31.963 に答える
1

または、jQuery.animate（）を使用することもできます

word.animate({height: 100, opacity: 1}, 5000);

CSSなしで、WebkitとMozillaの両方で動作します。これはCSS3を使おうとする目的に反しますが、私は推測します。

于 2012-07-15T08:12:44.727 に答える