0から目指すWebマスター Web制作に関する備忘録
検索

JavaScript

スクロールバーのカスタマイズ

サンプル

スクロールバーは、基本ブラウザが用意してるのを使えばいい、という考えでした。
そのため、スクロールバーのデザインをカスタマイズしたいと思ったとき、「いや、待てよ。スクロールバーを使うようなインラインフレームによる見せ方があるのでは?」と別案を模索して実装。
画面全体のスクロールバーであれば、別にブラウザが用意してるのでもOKな考えでした。

だが、しかしッ!

そんなことから、スクロールバーをカスタマイズしてデザインする選択肢を持っておいたほうがいいな、と今更ながらに思い立ちました。

ググる。

あった!あった!jQueryを使ったスクロールバーのカスタマイズ、サンプル

これこれ!素晴らしいー!
でも読み込むJSやらCSSやら多くて、カスタマイズもなんか難しそう。jqueryのライブラリを各最新版にしたら、動かなくなってしまって。。。
もっとシンプルにいきたくてさらにググる。

見つけたッ!自分にとってはこれがベストぉ!

fleXcroll

このライブラリ「fleXcroll」を使って、さらにスッキリさせました。
読み込むファイルはJS1ファイルだけっていうのと、CSSでの指定もしやすくいと嬉し。

サンプル