动画在鼠标按下时显示，在鼠标向上时消失

Question

我对jQuery真的很陌生，我正在尝试弄清楚如何在一个人单击并按住时出现动画或图像，然后在他们鼠标向上时消失。我已经弄清楚了如何使用此代码执行此操作：

<script>
$( "#clicky" )
  .mousedown(function() {
      $( this ).html('<img src="images/Diana.gif" style="width:500px;"/>');
  })
  .mouseup(function() {
    $(this).hide();
  });
</script>

但是整个div在鼠标向上时消失了！我想让它可以一遍又一遍地点击。也许我指的是错误的东西？感谢您的帮助！

Answer 1

下面是

一个示例：

$(document).on('mousedown',function(){
      $( "#clicky" ).show().html('<img src="http://upload.wikimedia.org/wikipedia/commons/thumb/f/fa/Apple_logo_black.svg/2000px-Apple_logo_black.svg.png" style="width:70px;"/>');
      })
     .on('mouseup',function() {
        $( "#clicky").hide();
      });

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div id="clicky"></div>