0

このウェブサイトのように、ウィンドウの 100% のスクロールを設定する方法を知っている人はいますか?

すべての < div > が幅 100%、高さ 100% に設定された垂直スクロールの Web サイトがあります。すべての < div ID > のリンクを使用して、スライドから別のスライドに直接スクロールできるアンカー システムがあります。

マウスホイールでも同じことができるようにしたいのですが、

http://www.apple.com/iphone-5c/

私のウェブサイト：

http://www.mb.nullame.com/

4

2 に答える 2

3

fullpage.jsを利用できます。それはまさにあなたが探していることをします。また、Internet Explorer 8、9などの古いブラウザにも対応しています...

それはかなり完全です。メニューを追加したり、スクロールのイージングや速度を変更したり、矢印を使って移動したり、ループしたりできます...

github リポジトリからダウンロードできます。

于 2013-10-02T22:21:17.887 に答える
0

絶対位置が 100% x 100% (ブラウザー ウィンドウを埋めるため) の Web サイト本体を実際の Web サイト コンテンツで div に入れ、スクロールを無効にし (オーバーフローを非表示)、onmousewheel イベント (およびタッチ デバイスのタッチ イベント) をリッスンして管理します。サイト - 「流暢」に見えるようにトランジションを使用して、「フレーム」ごとに 5 セットの CSS ルールとして作成します。実際にはcssでうまく再生できます-したがって、実際には1つのクラスのみを変更する必要があります-実際のサイトでこのdivのクラスを変更して、ビューポートを「スクロール」します。子要素には、次のような親依存の css を含めることができます。

.pictureA{
  position:absolute;
  transition:all 0.5s;
}
.realBody_0 .pictureA{
  left:-50%;
}
.realBody_1 .pictureA{
  left:0;
}

5 つのマウスホイール イベントの後、コンテンツ クラスの div が realBody_1 に変更されたとします。(適切に管理するために、ホイールの上下をカウントします)

于 2013-10-02T20:16:39.477 に答える