2

5秒後にロゴを非表示にしたいのですが。また、マウスがヘッダーdivの上にあるときにロゴが再び表示され、マウスがヘッダーdivから離れると再びフェードアウトするようにします。問題は、ヘッダーdivの上にマウスを置いて削除した後、まばたき効果のように、3回連続してフェードインおよびフェードアウトすることです。どうすればこれを防ぐことができますか？

スクリプトを本文と頭に配置して、違いがあるかどうかを確認してみましたが、成功しませんでした。また、関数を別々のスクリプトタグに配置してみました...

<script type="text/javascript">
    $(document).ready(function () {
        $('#logo').delay(5000).fadeTo( 5000, 0 );
    });
</script>

<script type="text/javascript">
function showLogo()
{
    $('#logo').fadeTo( 2500, 1 );
}
</script>

<script type="text/javascript">
function hideLogo() {
    $('#logo').delay(2500).fadeTo( 2500, 0 );
}
</script>

これはHTMLです：

<header id="header" onmouseover="showLogo()" onmouseout="hideLogo()">
<div id="logo">
<img src="images/logo.png">
</div>

助けてください！ありがとう！

4

2 に答える 2

2

stop()次の方法を使用できます。

$('#header').hover(function(){
    $('#logo').stop().fadeToggle(2500);
});
于 2012-06-02T17:22:43.467 に答える
0

私は次のことで幸運でした：

$(document).ready(function () {
    $('#logo').delay(5000).fadeTo( 5000, 0 );
    $('#header').mouseenter(function(e){showLogo();});
    $('#header').mouseleave(function(e){hideLogo();});
});

ヘッダータグでハンドラーをフックする代わりに。

于 2012-06-02T17:38:07.553 に答える