css - PSDに従ってScrollerをスタイルする方法

Question

カスタムスクロールバーのスタイルを設定する必要があります.現在、目的の結果を達成するための解決策がありません.::webkit-scrollerプロパティを使用しようとしましたが、機能しません.

Answer 1

以下のリンクでこのスクロールバープラグインを確認してください

http://jscrollpane.kelvinluck.com/

http://areaaperta.com/nicescroll/

http://manos.malihu.gr/jquery-custom-content-scroller/

Answer 2

jQuery プラグインを使用してこれを行うことができます。

http://manos.malihu.gr/tuts/jquery_custom_scrollbar.html

コード全体をメイン コンテナーにラップし、それに jQuery カスタム スクロール プラグインを適用し、それに応じてカスタム css を適用するだけで済みます。

Answer 3

これらの疑似要素と疑似クラスセレクターを試してください

::-webkit-scrollbar-track-piece:start {
   /* Select the top half (or left half) or scrollbar track individually */
}

::-webkit-scrollbar-thumb:window-inactive {
   /* Select the thumb when the browser window isn't in focus */
}

::-webkit-scrollbar-button:horizontal:decrement:hover {
   /* Select the down or left scroll button when it's being hovered by the mouse */
}