CSS を使用して、含まれている領域にコンテンツをオーバーフローさせる方法はありますか?ただし、スクロール可能にするのではなく、下部にあるページ番号ボタンでコンテンツをナビゲートできるようにしますか?
YouTube で動画を表示するときと同様のものを探すには、次の矢印または矢印の間にある特定のページ番号をクリックして、検索結果を解析します。
オーバーフローしたコンテンツをスクロールさせたくありません。下部にページ番号を表示します。
これを実現する最も簡単な方法は何ですか?
うん!セレクターとロケーション ハッシュを使用して:target
、必要に応じてコンテンツを表示 (または非表示) できます。
#frame > div { display: none; }
#frame > div:target { display: block; }
次に、単純なアンカーを使用してナビゲーションを行うことができます。
<a href="#one">One</a>
<a href="#two">Two</a>
<a href="#three">Three</a>
<a href="#four">Four</a>
内部の div #frame
(または任意のコンテナー) には、リンクで使用するハッシュに対応する ID が必要です。
ここに JSBin があります: http://jsbin.com/ifasok/1/edit