1

警告: jQuery の初心者...

私が取り組んでいるこのパララックス Web サイトでスクロールがどこにあるかに応じて、ヘッダーをフェードインおよびフェードアウトさせようとしています。私が抱えている問題は、イーズイン/イーズアウトする方法がわからないことです。

そして、 Stellar jQuery プラグインとウェイポイントを組み合わせて、この新しいサイトを作成しています。

ロード時に、 opacity: 0 を置く「hidden」を追加しました。

ここにナビゲーションのスニペットがあります:

<header class="navContainer">
<nav>
    <ul class="navigation">
        <li class="logoMenu" data-slide="1"><a><img id="logoEGmenu" src="images/eg-logo-menu.png" alt="Logo des Entreprises d'électricité EG ltée"></a></li>
        <li class="text" data-slide="2"><a>Accueil</a></li>
        <li class="text" data-slide="3"><a>Services</a></li>
        <li class="text" data-slide="4"><a>Maître électricien</a></li>
        <li class="text" data-slide="5"><a>Projets</a></li>
        <li class="text" data-slide="6"><a>LEED</a></li>
        <li class="text" data-slide="7"><a>Notre mission</a></li>
        <li class="text" data-slide="8"><a>Nos experts</a></li>
        <li class="text" data-slide="9"><a>Contact</a></li>
    </ul>
</nav>
<div id="logoBG">&nbsp;</div>
<div id="navBG">&nbsp;</div>
<div id="noiseBG">&nbsp;</div>

.js のスニペットを次に示します。

    // Fade in Nav
$('.navContainer').addClass('hidden');
$.waypoints.settings.scrollThrottle = 25;
$('.navContainer').waypoint(function(event, direction) {
    $('.navContainer').toggleClass('hidden', direction === "up");

}, {
    offset: '-100%'
});

助けてくれてありがとう！

4

0 に答える 0