javascript - ユーザーがカーソルを合わせたときに、src リンク アドレスを png から gif に変更する

Question

ここに私のJSがあります

script type="text/javascript">

  var src = $('Pic').attr('src');
  $('Pic').hover(function()
  {
    $(this).attr('src', src.replace('.png', '.gif'));
    }, function(){
      $(this).attr('src', src);
    });
  });
</script>

そして、ここに私の画像ボタンがあります:

<input id="Pic" type="image" src="BeerButton1.png" alt="Submit" width="600" height="600" style="top: 15%; position: absolute; left: 30%;" />

Answer 1

  <script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.7.1/jquery.min.js"></script>
  <script type="text/javascript">
  $(document).ready(function(){
    var src = $('#Pic').attr('src');
    $('#Pic').hover(function(){
         $(this).attr('src', src.replace('.png', '.gif'));
    }, function(){
        $(this).attr('src', src);
    });
  });
  </script>