1

divのフォントサイズで滑らかな正弦波パルスを作成するためにhtmlとjQueryを取得しようとすると問題が発生しました。オルタネーションは機能していますが、途切れがちです。setTimeout（）内でjavascriptのmath.sin（）を最適化して、pxに関するフォントサイズをよりスムーズに増減できるようにするためのより数学的なアプローチはありますか？

$(document).ready(function(e){
  var i = 10;
  var fontsize;
  function pulseLoop() {
        fontsize = (Math.sin(i) * 10) + 50;
        $(".changer-container").css("font-size",fontsize + "px");
        i = i + .5;
    setTimeout(pulseLoop, 100);
  }
  pulseLoop();

  $(document).focus();
});

http://jsfiddle.net/MdQxh/2/

4

1 に答える 1

4

timeout期間を調整する必要があります。

100 msは10fpsに相当します（1000/100で計算）。

スムーズに表示するには、少なくとも24〜30 fpsが必要です。したがって、スムーズなアニメーションを取得するには、遅延を少なくとも40msまたは30msまたは（60fps16の場合はmsでも）に設定します。

そのため、アニメーションは途切れ途切れに見えます。

これが60fpsでのフィドルです。i増分をからi = i + .5;に変更しました：http i = i + .2;：//jsfiddle.net/amyamy86/mecPv/

于 2013-03-26T00:26:53.740 に答える