Custom Scroll Bar Colors


Plugin Details

Customize the bowser scroll bar with custom colors and sizing.

Compatibility

  • Works with Squarespace 7.1

  • Uses Custom CSS


Add to Custom CSS

// CUSTOM BROWSER SCROLL BAR - GHOSTPLUGINS.COM //

/* Scroll Bar Width */
::-webkit-scrollbar {
  width: 15px;
}

/* Scroll Bar Track */
::-webkit-scrollbar-track {
  background: #f1f1f1;
  border-left: 1px solid #ddd;
}

/* Scroll Bar Handle */
::-webkit-scrollbar-thumb {
  background: #000;
}

/* Scroll Bar Handle on hover */
::-webkit-scrollbar-thumb:hover {
  background: #555;
}

Customizable Options

  • Scrollbar Width

  • Track Background Color

  • Track Left Border

  • Handle Color

  • Handle Color (On Hover)

Notes

  • Announcement bar will be fixed automatically as you scroll.

  • Adjust announcement bar colors and other styles Squarespace settings like normal.


Previous
Previous

Divider Lines Bettwen Links - Navigation Dropdown

Next
Next

Easy Vertical Text