0

http://leongaban.com/_stack/fade/

私はちょうどjQueryを始めたばかりで、この単純なフェードインとフェードアウトを行う方法に関するチュートリアルがたくさんありますが、AS3のバックグラウンドから来ると、以下のコードが機能するはずです.なぜそれがうまくいかないのか興味があります.だ。

  • ロールオーバーすると、黄色のボックスがフェードアウトします
  • ただし、ロールアウトすると、黄色のボックスがフェードインしてから再びフェードインします

マウスアウト機能を「バウンス」する理由がわかりません...考えていますか？

HTML

<div class="fade">
    <h2>The Title</h2>

    <p>Lorem ipsum.</p>
</div>

jQuery

<script>

    (function() {

        var fade = $('div.fade');

        fade.mouseover(function() {

                fade.fadeOut(500);

        });

        fade.mouseout(function() {

            fade.fadeIn(600);
        });

    })();

</script>
4

3 に答える 3

6

でフェードアウトしているためですmouseover。フェードアウトが完了すると、要素は非表示になります。したがって、マウスを2番目に動かすと、mouseoutイベントが登録され、フェードインします。

.animate({opacity: 0}, 600);、 .animate({opacity: 1}, 600);などを使ってみてください。

于 2012-12-06T16:54:07.203 に答える
1

代わりにmouseenter/の使用を検討する必要があります。mouseleave

ご覧ください-http ://www.quirksmode.org/js/events_mouse.html

また、hoverintentプラグインは試してみる価値があります。

于 2012-12-06T16:54:05.447 に答える
0

mouseenter関数と関数を使用する必要がありmouseleaveます。mouseoverマウスが要素に出入りするたびに発火します。

デモをチェックしmouseoverて動作を確認し、適切なイベントではない理由を確認してください。

于 2012-12-06T16:56:10.170 に答える