2018年06月3日(日)

CSSだけでスクロールしても追従するサイドバー

• 0
• 10
• 11
• 40

Result

See the Pen WyQWoL by kachibito (@kachibito) on CodePen.

よく見かけるスクロール時のストーカーコンテンツをCSSだけでやろうという内容です。
特にトリックでもなんでもないのすが、position: sticky;使えばいい部ブラウザを除いてできるようになりましたので使用例的な記事です。
position: sticky;に関してはtableのネタでも以前書きましたので参考になりましたら幸いです。
position: sticky;でtableを下スクロール時はヘッダ、横スクロール時は最左を固定

css

aside h3 { background: yellow; position: -webkit-sticky; position: sticky; top: 0; }

html

foo

can i use

Can I Use css-sticky?

position: st...