2

最初にautoに設定されているときに、csstransitionsプロパティを使用すると問題が発生するようです。これを回避するために、css遷移プロパティを追加する前に、jqueryを使用して初期cssプロパティを設定しました。

私が抱えている問題は、最初のcssプロパティを設定した直後に遷移プロパティを定義すると、奇妙な動作をすることです。例: http: //jsfiddle.net/3zUDc/10/

ただし、遷移プロパティの設定を数ミリ秒遅らせると、意図した動作が得られますが、コードは見苦しいようです。例: http: //jsfiddle.net/3zUDc/9/

css遷移と宛先パラメーターをsetTimeoutブロックに入れずに、2番目の例で見られる動作を実現する方法はありますか?

助けてくれてありがとう!

4

2 に答える 2

1

.show()は答えです...

$('a:first').click(function(){
    $(this).css({'width': $(this).width() / $(this).parent().width() * 100 + '%', 'height': $(this).height()});
    $('a:first').show().css({
        '-webkit-transition': 'all 3s', 
        '-moz-transition': 'all 3s', 
        width: '100%', 
        height: '100px', 
        backgroundColor: 'black'
    });
});

これがjsfiddleのデモです

于 2012-06-27T15:51:04.573 に答える
0

.css('left')css宣言の最後に追加できます:http: //jsfiddle.net/YDt7G/

これが機能する(または機能しない)理由は、ブラウザのjavascriptエンジンがDOMを変更するコードを最適化するためです。したがって、コードのすべての行の直後にDOMを更新するわけではなく、基本的にすべてのコードを1つのDOM更新に入れます。

強制ブラウザのjavascript.css('left')エンジンにDOMを確認させ、次にDOMを事前に更新します。

于 2014-05-20T15:59:05.137 に答える