Appleに学ぶ、横スクロールナビを組む時のCSSメモ - Qiita
やりたいこと 横スクロールするナビを組みたい … ① スマホ(iOS)で慣性スクロールにしたい … ② スクロールバー非表示にしたい … ③ ②と③を両立させたい ① 横スクロールするナビを組みたい スマホサイトでよく見る上図のようなナビゲーションを組みたいとします。 今回は、一つ一つの li を table-cell にし、水平に並べつつ、ウィンドウからはみ出た分を overflow-x: auto; で横スクロールさせるシンプル組み方で考えます。 デモ → https://s.codepen.io/skwbr/debug/QjaBLV/NjrYzwNZpgwA (コードは下記にて) ② スマホ(iOS)で慣性スクロールにしたい overflow: auto; をかけている要素に下記を指定すればOK。 ③ スクロールバー非表示にしたい webkit独自拡張の ::-webkit-scro
phiary
Code html 目次となるアンカーと, ページトップに移動するアンカーを設置しています. <body> <h1 id='top'>jQuery でページ内リンクを全てスムーズスクロールにしよう</h1> <h2>Table of contents</h2> <ul> <li><a href='#section1'>Section 1</a></li> <li><a href='#section2'>Section 2</a></li> <li><a href='#section3'>Section 3</a></li> <li><a href='#section4'>Section 4</a></li> </ul> <h2 id='section1'>Section 1</h2> <p class='pad'>Text Text Text Text</p> <a href='#top'
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
処理を実行中です
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
