0

私のウェブサイトwww.pburtchaell.comで、セクション間のナビゲーションを備えたフルスクリーン セクションを実装したいと考えています。

現在、サイトの各セクション (about、services、work、connect) を 4 つのフルスクリーン セクションに分割し、それぞれに ID タグを付けています。次に例を示します。

<section id="services">
<!-- Section Content -->
</section>

<section id="works">
<!-- Section Content -->
</section>

jQuery の $.scrollTo() 関数を使用して、各セクション間の「次へ」および「前へ」のナビゲーションを有効にします。また、すべてのオーバーフローを非表示にして、これらの「次へ」および「前へ」ボタン以外でサイトをナビゲートできないようにします。

ただし、ここに問題があります。一部のセクション (特にモバイル デバイス) では、コンテンツがユーザーのビューポートからはみ出すことがよくあります。たとえば、サービス セクションでは、ビューポートが 1920px でない限り、すべてのコンテンツを表示するためにスクロールする必要がありますが、これは想定どおりです。

ボタンナビゲーション(またはおそらく矢印キーナビゲーション)のみを使用してセクションのナビゲーションを許可し、セクション自体内でのスクロールを許可する方法はありますか?

4

1 に答える 1

0

視差スクロールからいくつかのアイデアを使用することをお勧めします。これには、jquery プラグインの 1 つを使用できます: http://inspirationfeed.com/resources/tools/5-best-jquery-plugins-for-parallax-scrolling/

そのため、セクションをより明確に管理できます。

github.com/jeresig/jquery.hotkeys 

適切なキー マップ構造を作成します。

于 2013-06-13T02:28:08.607 に答える