Is there any code that can control the scroll bar color while using Text set to Scroll? Night be quite useful and snazzy!
Thanks.
Scroll bar color with Text set to Scroll?
Forum rules
IMPORTANT NOTE!!
DO YOU HAVE A QUESTION OR PROBLEM AND WANT QUICK HELP?
THEN PLEASE SHARE A "DEMO" PROJECT.
PLEASE READ THE FORUM RULES BEFORE YOU POST:
http://www.wysiwygwebbuilder.com/forum/viewtopic.php?f=12&t=1901
MUST READ:
http://www.wysiwygwebbuilder.com/getting_started.html
WYSIWYG Web Builder FAQ
IMPORTANT NOTE!!
DO YOU HAVE A QUESTION OR PROBLEM AND WANT QUICK HELP?
THEN PLEASE SHARE A "DEMO" PROJECT.
PLEASE READ THE FORUM RULES BEFORE YOU POST:
http://www.wysiwygwebbuilder.com/forum/viewtopic.php?f=12&t=1901
MUST READ:
http://www.wysiwygwebbuilder.com/getting_started.html
WYSIWYG Web Builder FAQ
- Pablo
- Posts: 24942
- Joined: Sun Mar 28, 2004 12:00 pm
- Location: Europe
- Contact:
Re: Scroll bar color with Text set to Scroll?
There is no standard option to control the scrollbar of scroll-able text.
-
Beth
-

- Posts: 149
- Joined: Mon Jan 15, 2018 10:55 pm
Re: Scroll bar color with Text set to Scroll?
Thank you Pablo. I just thought it might be cool.
- crispy68
-

- Posts: 3225
- Joined: Thu Oct 23, 2014 12:43 am
- Location: Acworth, GA
- Contact:
Re: Scroll bar color with Text set to Scroll?
@Beth,
You can try this. Either insert an html box or use the page html, set between the <head> tags the following:
You will need to change "wb_Text1" to the ID of your text box.
Here is the commented section to help explain the code better:
You can try this. Either insert an html box or use the page html, set between the <head> tags the following:
Code: Select all
<style>
#wb_Text1{scrollbar-color: #ff69b4 #0000ff;}
#wb_Text1::-webkit-scrollbar{width:40px;}
#wb_Text1::-webkit-scrollbar-track{background: #0000ff;}
#wb_Text1::-webkit-scrollbar-thumb{background-color: #ff69b4;border-radius:5px;}
</style>
Here is the commented section to help explain the code better:
Code: Select all
<style>
/* Step 2: Modern Standard Property (Firefox, Chrome 121+, Edge 121+) */
/* Syntax: scrollbar-color: [Thumb Color] [Track Color]; */
#wb_Text1{scrollbar-color: #ff69b4 #0000ff;}
/* WebKit Pseudo-elements (Legacy Chrome, Safari, Older Edge) */
/* Target the scrollbar width */
#wb_Text1::-webkit-scrollbar{width:40px;}
/* Target the track (background) color */
#wb_Text1::-webkit-scrollbar-track{background: #0000ff;}
/* Target the thumb (movable bar) color */
#wb_Text1::-webkit-scrollbar-thumb{background-color: #ff69b4;border-radius:5px; /* Optional: rounds the corners of the bar */}
</style>