jquery - キーが押されている間に再生される簡単なアニメーションの作成

Question

私は次のことをしたいと思いますが、最も効率的なアプローチは何なのか疑問に思っています。

特定のキーが押されている間、ある jpeg から次の jpeg に指定できる速度で一連の jpeg を循環させ、最終的な画像を無期限に画面に維持したいと考えています。

Answer 1

まず、スタック オーバーフローへようこそ。通常、あなたが試みたことのいくつかの例を提供するのが通例です。次回は、まず何かを試してみてください。コードを見ると、もっと役に立ちます！

これで始められるはずです。キーを押しているconsole.log間だけです。enter/return解放されると、もう 1 つ作成され、次にキーが押されたconsole.logときにイベントが再バインドされます。enter/return

これがフィドルの例です

(function(){
  var intervalId;

  // your animations should go here
  var someFunc = function(){
    console.log("executing");
  }

  var keyDownFn = function(e){
    if(e.keyCode == 13){ // 13 is enter/return
      $(window).unbind('keydown.animation');
      $(window).bind('keyup.animation', keyUpFn);
      intervalId = setInterval(someFunc, 500);
    }
  }

  var keyUpFn = function(e){
    if(e.keyCode == 13){ // 13 is enter/return
      console.log("stopping");
      $(window).unbind('keyup.animation');
      $(window).bind('keydown.animation', keyDownFn);
      clearInterval(intervalId);
    } 
  }

  // this line fires the whole thing off
  $(window).bind('keydown.animation', keyDownFn);

})();​