1
   <script language="javascript" type="text/javascript" >
   $(
   function () {
   $('li').mouseover(function () {
   var $this = $(this);
  $('#previewImage').animate({ opacity: 0.1 }, 0, function () {
  $(this).attr("src", 'img/' + $this.attr('id') + '.jpg').animate({ opacity: 1 }, 1000);
  });
  // mouseout should come here and hover image should come back to normal while mouseout

  });
  });
  </script>

親切に助けてください、ここに来て、マウスアウトイベントが発生している間、ホバー画像が通常に戻るはずです!!

4

2 に答える 2

1

ここにも HTML コードがあれば最高です。考慮すべき点は次のとおりです。

  1. Document Ready 関数でコードをまとめる
  2. マウスオーバーとマウスアウトでアニメーション化する html 属性を選択します
  3. そして、イベントハンドラには関数を渡すことができますし、mouseover や mouseout はイベントハンドラなので、それらに関数を渡すと良いと思います。

以下のスニペットを見てください。

<script type="text/javascript">

    $(function() {

        $('previewImage').mouseover(function() {
            // pass the function here
        }).stop(true, true).mouseout(function() {
            // pass the function here
        });
    });
</script>
于 2013-05-16T22:52:27.190 に答える
0

私が間違っていなければ、あなたの問題はあなたが使用している this と $this に関連している可能性があります.2番目の関数には、まったく異なる this ポインターがあります..

パラメータとして渡すことをお勧めします

function (passThisPtr) {
$(this).attr("src", 'img/' + $this.attr('id') + '.jpg').animate({ opacity: 1 }, 1000);
});

またはそれをパラメーターにバインドします...

function () {
$(this).attr("src", 'img/' + $this.attr('id') + '.jpg').animate({ opacity: 1 }, 1000);
}.bind(passThisPtr));

繰り返しますが、何が起こっているのかわからないため、正確に知ることは困難ですが、これが問題だと思います..

于 2013-05-16T22:36:07.547 に答える