0

私はjqueryにかなり慣れていませんが、デザイナーが望んでいたいくつかの効果をどうにかすることができました。このフィドルを見てください:

jsフィドル

だから言葉が前面に出てきて、色を変えて背景にフェードバックし、また色を変えてほしい。

私が現在使用している .animate メソッドはあまりスムーズではありません。stackoverflow を検索したところ、適切な解決策が見つかりませんでしたが、それが機能しない理由が見つかりました。レンダリングとブラウザの互換性があるものです。詳細はこちら

jquery .css メソッドについて何か読んで、それを試してみました。実際、はるかにスムーズな移行。唯一の問題は、いくつかのスタイルを組み合わせることができないように見えるため、.animate メソッドでできるように次々とアニメーション化されることです: 上記の jfiddle に示すように

var duration = 1400;
$('.dgrey').css({"-webkit-transform":"scale(2)","-webkit-transition-timing-function":"ease-in", "-webkit-transition-duration": duration + "ms", "color":"#E5352D"});
$('.dgrey').css({"-webkit-transform":"scale(0.5)","-webkit-transition-timing-function":"ease-in", "-webkit-transition-duration": duration + "ms", "color":"#DDDDDD"});

誰かがこれに対する解決策を持っていますか?

前もって感謝します

4

3 に答える 3

0

webkit transition-end イベントなどがありますが、既に期間がある場所で行っていることについては、単純なタイムアウトの方が簡単なようです:

var duration = 1400;

function ani() {
     $('.dgrey').css({'animation here'});
     setTimeout(function() {
         $('.dgrey').css({next animation here});
         setTimeout(ani, duration);
     }, duration);
}

ani();

フィドル

于 2013-07-22T15:18:36.357 に答える