0

HTML ページにセクションを指定します。各セクションの幅と高さは 100% で、画面サイズを取得します。スクロールバーを表示したくないため、本文とセクションのオーバーフローは非表示になっています。代わりに、セクション間のナビゲーションにメニューとマウスホイールのみを使用したいと思います。

問題は、一度に 1 つのセクション (100% の高さ) だけをスクロールする必要があるというネットで見つけたスクリプトを適応させる方法がわからないことです...スクリプトを修正できる場合:

$(document).ready( function() {
    $('body').mousewheel(function(event, delta) {
        if (delta < 0) {
            $('body').scrollTo('+=800', 1500, {easing : 'easeInCirc'});
        }
        else {
            $('body').scrollTo('-=800', 1500, {easing : 'easeInCirc'});
        }
    return false;
    }); 
});

(+=800 と -=800 を指定したのは、これがピクセルだと思ったからです。このようなものでもありません。とにかく、正確なピクセルではなく 100% が必要です...)

HTML は単純です。

<body>
    <div class="section"></div>
    <div class="section"></div>
    <div class="section"></div>
</body>

ここに私のテストページがあります：http://photography.igorlaszlo.com/test.html - メニューはすでに私が望むものをしています（まだ完璧ではないスティッキー効果を除いて、問題ではありません）。

これが私がやりたい素晴らしい例です: http://www.atelier-serge-thoraval.com

前もって感謝します ！

4

1 に答える 1

2

わかりました、それはクレイジーですが、このウェブサイトで質問をすると、常に答えが見つかります...前ではありません! :)タイトルを入力すると、サイドバーが関連リンクを提案するためです（今発見しました）。それは私の英語のせいでもあります.Googleまたはここで適切な単語を見つける必要があります.

これは私が探しているものです:

http://alvarotrigo.com/fullPage/

https://github.com/alvarotrigo/fullPage.js

しかし、私はパニックに陥るかもしれませんが、まだインストールする必要があります... :)

于 2014-06-13T03:05:18.280 に答える