jquery - 创建一个在按键被按下时播放的简单动画

Question

我想做以下事情，我想知道最有效的方法是什么：

按下特定键时，我想以我可以指定的速率从一个 jpeg 到下一个 jpeg 循环浏览一组 jpeg，然后将最终图像无限期地保留在屏幕上。

Answer 1

首先，欢迎来到 Stack Overflow。通常习惯性地提供一些您尝试过的示例。下次，先尝试一下。当我们看到一些代码时，我们会更有帮助！

这应该让你开始。它只会console.log在enter/return按住键时。一旦它被释放，它会再做一个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);

})();​