position: fixedなscrollbarを実現する

公開日:2018-10-15
最終更新:2018-10-24

背景

お仕事で作っている管理画面システムですごく長いテーブルを表示させるんですが、bootstrapのテンプレートを使っている関係で、画面全体のスクロールバーは使えず、横のスクロールバーが下の方に行かないと出ないという状況になりました。

検索したけど情報が出てこなかったので、自分で考えました。

解決方法

scrollさせたい対象と同じ幅の中身のないFixedなElementを用意して、そこのスクロールと対象のスクロール量を同じにしてやりました。

See the Pen Fixed Scroll Bar by maruyama (@tempakyousuke) on CodePen.

自分ではこれぐらいしか思いつきませんでしたが、もしもっといい方法があれば教えてください。

記事が少しでもいいなと思ったらクラップを送ってみよう!
18
+1
@1phXZYyP8NTs1yKwの技術ブログ

よく一緒に読まれている記事

0件のコメント

ブログ開設 or ログイン してコメントを送ってみよう
目次をみる

技術ブログをはじめよう

Qrunch(クランチ)は、ITエンジニアリングに携わる全ての人のための技術ブログプラットフォームです。

技術ブログを開設する

Qrunchでアウトプットをはじめよう

Qrunch(クランチ)は、ITエンジニアリングに携わる全ての人のための技術ブログプラットフォームです。

Markdownで書ける

ログ機能でアウトプットを加速

デザインのカスタマイズが可能

技術ブログ開設

ここから先はアカウント(ブログ)開設が必要です

英数字4文字以上
.qrunch.io
英数字6文字以上
ログインする