2008年5月アーカイブ

インラインフレームやCSSによる擬似インラインフレームなどでコンテンツ内にスクロールをさせる場合など、スクロールバーがブラウザに依存するため、デザインにマッチしなかったり、色のみの変更ではどうしてもやぼったかったりすることがよくあります。

その為にコンテンツ内にスクロールさせるエリアを設けることは極力避けてきたのですが、良いものがあることが分かりました。

スクロールバーを装飾できるAjaxライブラリ　【 fleXcroll 】

設置はflexcroll.jsと装飾用のスタイルシートをヘッダーインクルードして、スクロールバーの付く要素にclass="flexcroll"を加えるだけです。

ファイルをダウンロードするとサンプルも付属されているので、用意されているデザインが気に入らない場合でも参考にしてオリジナルのデザインに変更できます。
画像とスタイルシートで幅やサイズ変更もできるので、これですっきりとしたデザインのスクロールバーができました。

IE6や5.5でfloatしたボックスがおかしい(倍になる)件。

今までアンダーラインハックとかして無理くり調整していましたが、display: inline;入れると解消できるそうです。

なんでやねん。

どちらも納得いかない回避方法ですが、こっちの方が楽だし問題も起きにくそうなので覚えておこうかと。