SitePoint Sponsor

User Tag List

Results 1 to 15 of 15
  1. #1
    Rusted & Weathered HumanClay's Avatar
    Join Date
    Sep 2000
    Location
    Milwaukee, WI
    Posts
    225
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)

    TEXTAREA Scroll Bar Styles

    I have a question. I have set the scrollbar for the browser window to a different color using CSS. (like the scroll bar on this page --> ) I have a textarea box on my page, and the scrollbar is set to the same color. I was wondering how I would set it to the default scrollbar color. I assume you would use the same CSS properties as I used to change the window scrollbar, but what is the default color values?
    Steve Caponetto - [profile] [e-mail]
    CreedFeed.com - feed your need for Creed!

  2. #2
    SitePoint Wizard creole's Avatar
    Join Date
    Oct 2000
    Location
    Nashvegas Baby!
    Posts
    7,845
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Create a class that contains the same declarations as the BODY tag, then simply say <textarea class="xxx">.
    Adobe Certified Coldfusion MX 7 Developer
    Adobe Certified Advanced Coldfusion MX Developer
    My Blog (new) | My Family | My Freelance | My Recipes

  3. #3
    Rusted & Weathered HumanClay's Avatar
    Join Date
    Sep 2000
    Location
    Milwaukee, WI
    Posts
    225
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    I know how to do that. I'm asking how to give the textarea scrollbars the default color (as they would appear if I never gave the page scrollbars a color). Is that possible?
    Steve Caponetto - [profile] [e-mail]
    CreedFeed.com - feed your need for Creed!

  4. #4
    SitePoint Wizard creole's Avatar
    Join Date
    Oct 2000
    Location
    Nashvegas Baby!
    Posts
    7,845
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Well, you mean the users default system colors? The user should see their default system colors unless you are specifically changing the TEXTAREA tag with CSS. I don't use those declarations much so I'm not the best advisor on this particular area of CSS.
    Adobe Certified Coldfusion MX 7 Developer
    Adobe Certified Advanced Coldfusion MX Developer
    My Blog (new) | My Family | My Freelance | My Recipes

  5. #5
    .net install meltdown
    Join Date
    May 2001
    Location
    View Ridge
    Posts
    692
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Sounds like the scrollbar for the text area is inheriting the properties you've assigned to the browser's scrollbar?

    Since the scrollbar stuff only works in IE you may be able to use viewInheritStyle to break the inheritance. I've never tried implementing this, but perhaps it can help.

    Sorry, can't help on the defualt colors for IE, although if someone else does, using a class for your text area would probably be easier than the method above.

  6. #6
    Rusted & Weathered HumanClay's Avatar
    Join Date
    Sep 2000
    Location
    Milwaukee, WI
    Posts
    225
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Well I did this:

    BODY {
    scrollbar-face-color: #666666; scrollbar-shadow-color: #000000;;
    scrollbar-highlight-color: #666666; scrollbar-3dlight-color: #777777;
    scrollbar-darkshadow-color: #333333; scrollbar-track-color: #484848;
    scrollbar-arrow-color: #000000
    }

    And when the page loads, a textarea box has those same colors for it's scrollbars.
    Steve Caponetto - [profile] [e-mail]
    CreedFeed.com - feed your need for Creed!

  7. #7
    SitePoint Wizard creole's Avatar
    Join Date
    Oct 2000
    Location
    Nashvegas Baby!
    Posts
    7,845
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Hmmm...sounds like you might not be able to get around that. You could take a chance and make the TEXTAREA Windows default colors (blue/grey) by assigning is a class of it's own, but I don't know if that would work properly.
    Adobe Certified Coldfusion MX 7 Developer
    Adobe Certified Advanced Coldfusion MX Developer
    My Blog (new) | My Family | My Freelance | My Recipes

  8. #8
    Rusted & Weathered HumanClay's Avatar
    Join Date
    Sep 2000
    Location
    Milwaukee, WI
    Posts
    225
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    I just created a new class and assigned it to the textarea. I did as you said, setting it to generic grey colors (not sure if they are the default on Windows, but it looks close to it). That works. I guess I'll have to live with that
    Steve Caponetto - [profile] [e-mail]
    CreedFeed.com - feed your need for Creed!

  9. #9
    SitePoint Wizard creole's Avatar
    Join Date
    Oct 2000
    Location
    Nashvegas Baby!
    Posts
    7,845
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    If yo uwant it exact, then just take a screenshot of a regular window, open it in Photoshop (or your image editor) and sample the colors directly.
    Adobe Certified Coldfusion MX 7 Developer
    Adobe Certified Advanced Coldfusion MX Developer
    My Blog (new) | My Family | My Freelance | My Recipes

  10. #10
    Rusted & Weathered HumanClay's Avatar
    Join Date
    Sep 2000
    Location
    Milwaukee, WI
    Posts
    225
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Actually, that's what I did... except I can't remember if I changed the colors of the scrollbars in Windows. And I didn't feel like changing the theme to the Windows default to be sure. It looks close enough for me, so I'm happy
    Steve Caponetto - [profile] [e-mail]
    CreedFeed.com - feed your need for Creed!

  11. #11
    We like music. weirdbeardmt's Avatar
    Join Date
    May 2001
    Location
    Channel Islands Girth: Footlong
    Posts
    5,882
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    I have no idea whether or not this attribute exists, but it's worth a shot, especially as I love pointing out the obvious (in the vain hope that it might work)..

    scrollbar-face-color: default; scrollbar-shadow-color: default;

    ??
    I swear to drunk I'm not God.
    Matt's debating is not a crime
    Hint: Don't buy a stupid dwarf Clicky

  12. #12
    SitePoint Enthusiast
    Join Date
    Aug 2001
    Posts
    75
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    I'm experiencing this too, but I liked what it did to my site, so my query is - how to color the scrollbars inside a <select> tag? I tried every which way, so I don't think it can be done.

  13. #13
    Rusted & Weathered HumanClay's Avatar
    Join Date
    Sep 2000
    Location
    Milwaukee, WI
    Posts
    225
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    To change the colors of scrollbars in a <select> do this in your style sheet:

    SELECT {
    scrollbar-face-color: #666666; scrollbar-shadow-color: #000000;;
    scrollbar-highlight-color: #666666; scrollbar-3dlight-color: #777777;
    scrollbar-darkshadow-color: #333333; scrollbar-track-color: #484848;
    scrollbar-arrow-color: #000000
    }
    Steve Caponetto - [profile] [e-mail]
    CreedFeed.com - feed your need for Creed!

  14. #14
    SitePoint Enthusiast
    Join Date
    Aug 2001
    Posts
    75
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    I tried that, HumanClay. It didn't work.
    signature

  15. #15
    Victory shall be mine tubedogg's Avatar
    Join Date
    Mar 2001
    Location
    Medina, OH
    Posts
    440
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Currently changing a <select> form element isn't possible. I can't remember if it's in the CSS spec that way (I suspect not) but none of the browsers support it.
    Kevin


Bookmarks

Posting Permissions

  • You may not post new threads
  • You may not post replies
  • You may not post attachments
  • You may not edit your posts
  •