54 users online (0 members and 54 guests)  

> > > > Changing Color of Text Box Scroll Bar

  Results 1 to 5 of 5

Related

  1. changing background color of a section using css and javascript    Forum: CSS Forum
    Replies: 17
  2. Changing Text With a Button    Forum: HTML Forum
    Replies: 1
  3. changing the color of scrollbar in an iframe    Forum: CSS Forum
    Replies: 3
  4. Changing Text Box Scroll Bar Color    Forum: HTML Forum
    Replies: 1
  5. Change Browser Color to match scroll bars?    Forum: CSS Forum
    Replies: 2
  1. 08-13-2004, 08:38 PM #1
    DaWebmasta
    DaWebmasta is offline
    DaWebmasta's Avatar
    Senior Member
    Status
    Offline
    Join Date
    Jul 2004
    Posts
    83

    Question Changing Color of Text Box Scroll Bar

    ---Hello

    ---I Was Wondering If There Is A Way I Can Change The Color
    ---Of A Text Box Scroll Bar So That It Does Not Have The Same
    ---Color As The Window Scroll Bar

    --- Thanx

    ---DaWebmasta
    Reply With Quote Reply With Quote
  2. 08-14-2004, 10:21 AM #2
    krak_d
    krak_d is offline
    krak_d's Avatar
    Senior Member
    Status
    Offline
    Join Date
    Mar 2004
    Location
    Liverpool
    Posts
    166
    Hi DaWebmaster,

    create your text area with a div and give the div an id..

    eg. <div id="txtarea" style="width: 200px; height: 200px; overflow: scroll; border: 5px dashed black; background-color: #ccc;">
    This is where all the stuff goes.<br />
    Add some more stuff, and instead of growing, it will have a scrollbar.This is where all the stuff goes.<br />
    </div>
    (the above provided by QuietDean btw )



    Then in your CSS add the following:

    #txtarea {scrollbar-face-color: #ffffff;
    scrollbar-shadow-color: #aaaaaa;
    scrollbar-highlight-color: #aaaaaa;
    scrollbar-3dlight-color: #ffffff;
    scrollbar-darkshadow-color: #ffffff;
    scrollbar-track-color: #ffffff;
    scrollbar-arrow-color: #aaaaaa;}

    obviously you can choose colors of your liking!

    Hope this helps,
    krak_d
    Reply With Quote Reply With Quote
  3. 08-14-2004, 10:37 AM #3
    DaWebmasta
    DaWebmasta is offline
    DaWebmasta's Avatar
    Senior Member
    Status
    Offline
    Join Date
    Jul 2004
    Posts
    83
    ---Thanx krak_d And quietdean For The Code

    ---I'm Sure The Code Works But I'm Not Sure Where My
    ---CSS Is I'm Not That Good With This Kind Of Stuff Can You
    ---Please Tell Me Where I Need To Put The Second Code That
    ---You Gave Me

    ---DaWebmasta
    Last edited by DaWebmasta; 08-14-2004 at 10:44 AM.
    Reply With Quote Reply With Quote
  4. 08-14-2004, 11:08 AM #4
    krak_d
    krak_d is offline
    krak_d's Avatar
    Senior Member
    Status
    Offline
    Join Date
    Mar 2004
    Location
    Liverpool
    Posts
    166
    If you are not using an external stylesheet, then add this between your <head> </head> tags.

    eg.


    <head>
    <style type="text/css">
    <!--
    #txtarea {scrollbar-face-color: #ffffff;
    scrollbar-shadow-color: #aaaaaa;
    scrollbar-highlight-color: #aaaaaa;
    scrollbar-3dlight-color: #ffffff;
    scrollbar-darkshadow-color: #ffffff;
    scrollbar-track-color: #ffffff;
    scrollbar-arrow-color: #aaaaaa;}
    -->
    </style>
    </head>

    krak_d
    Reply With Quote Reply With Quote
  5. 08-14-2004, 05:17 PM #5
    DaWebmasta
    DaWebmasta is offline
    DaWebmasta's Avatar
    Senior Member
    Status
    Offline
    Join Date
    Jul 2004
    Posts
    83
    ---O Ok I Gotch You Thanx krak_d

    ---DaWebmasta


    Reply With Quote Reply With Quote
« Previous Thread | Next Thread »

Tags for this Thread