View Full Version : Help with colored scrollbar
Tjololo 04-11-2004, 07:22 PM Hey, I am at a loss here...Here's the code I used, I took it from the lineup or whatever in the css thingy in the <head> tag:
scrollbar-face-color : #FF6600;
scrollbar-highlight-color : #FFCC99;
scrollbar-3dlight-color : #0099FF;
scrollbar-shadow-color : #0000FF;
scrollbar-darkshadow-color : #000000;
scrollbar-track-color : #FFFF00;
scrollbar-arrow-color : #000000;
But what it does is it doesn't color the scrollbar. Here (http://www.geocities.com/land_ataraxia/index.htm) is the site where I used it. It made the shadows and track, but the scrollbar itself isn't colored. I was trying to make the scrollbar #FF6600. Could someone please help me, because i can't figure it out.
Tjololo 04-11-2004, 08:03 PM I'm changing the link I gave, so go here to see the code: here (http://www.geocities.com/land_ataraxia/csstest.html)
MaGiCSuN 04-11-2004, 09:54 PM it is colored here. Anywayz this part needs some change though:
A:hover
{ text-decoration: value; underline color:#FF3300;
background-image: url(http://www.geocities.com/land_ataraxia/sunset.jpg);
background-color: #000000;
you need either to add a closing } after the background color like this:
A:hover
{ text-decoration: value; underline color:#FF3300;
background-image: url(http://www.geocities.com/land_ataraxia/sunset.jpg);
background-color: #000000;}
or remove the whole background image and color thingy, because i'm not sure if you really want the links to have a background on hover. Becuase that part above belongs to the hover part of the links :) If you don't want it then your hover part will be :
A:hover
{ text-decoration: value; underline color:#FF3300;}
Love,
Mirna
Tjololo 04-12-2004, 01:04 AM Hmm, I didn't even see that. The scrollbar isn't colored like I wanted it to be though. The track is, and the outlines and highlights and arrows, but the...Ok here's where I get confusing...the box that the arrows are in and the rectangle that you move to scroll are gray, and I wanted them to be red...specifically FF6600. If it's confusing or hard to get don't worry about it, I'll either figure it out or scrap it and do something else.
bourdelson 04-12-2004, 01:10 AM The parts of the boxes with the arrows that are gray are part of the scrollbar face color. They can't be colored separately.
Tjololo 04-12-2004, 01:12 AM Mm, I didn't want them colored differently, I wanted them different than gray...Did you mean I couldn't do that?
bourdelson 04-12-2004, 01:20 AM Oh, yes, you can change that color. I thought you were talking about just the little boxes with the arrows. You change the scrollbar-face-color to whatever color you want. Sorry, I misread your post. :)
Tjololo 04-12-2004, 01:23 AM I did:
scrollbar-face-color : #FF6600;
scrollbar-highlight-color : #FFCC99;
scrollbar-3dlight-color : #0099FF;
scrollbar-shadow-color : #0000FF;
scrollbar-darkshadow-color : #000000;
scrollbar-track-color : #FFFF00;
scrollbar-arrow-color : #000000;
I have the face color set to FF6600, but as you can see here: http://www.geocities.com/land_ataraxia/csstest.html
it's still gray. I dunno, maybe geocities doesn't like css.
bourdelson 04-12-2004, 01:34 AM It should work, because I've used the scrollbar color code on GeoCities before and it's never done this. Weird.
I was looking through your CSS, and though this has nothing to do with your scrollbar, some things aren't in there correctly.
<style type="text/css">
A:link
{ text-decoration: underline; color:#99FF66; }
A:visited
{ text-decoration: line-through; color:#FFFFCC; }
A:active
{ text-decoration: underline overline; color:#FFFFFF; }
A:hover
{ text-decoration: underline; color:#FF3300;}
h1 {font-family: arial;
color:#ffffff;}
p {font-family: arial;
color:#FFFF00; }
body
{ background-image: url(http://www.geocities.com/land_ataraxia/sunset.jpg);
background-repeat: no-repeat;
background-position: center;
background-attachment: fixed;
font-family: arial;
color: #FFFFFF ;
letter-spacing: 3pt;
font-weight: normal;
font-size:small;
scrollbar-face-color : #FF6600;
scrollbar-highlight-color : #FFCC99;
scrollbar-3dlight-color : #0099FF;
scrollbar-shadow-color : #0000FF;
scrollbar-darkshadow-color : #000000;
scrollbar-track-color : #FFFF00;
scrollbar-arrow-color : #000000;
margin-top: 0;
margin-bottom: 0;
margin-left: 0;
margin-right: 0;
padding-top: 0;
padding-bottom: 0;
padding-left: 0;
padding-right: 0;
}
#menu {
position: absolute;
left: 5px;
padding: 0px;
width: 150px;
}
#content {
margin-left: 200px;
padding: 0px;
margin-right: 15px;
}
td
{ font-family:arial;
color: #FFFFFF;
padding: 2cm;
}
input, textarea
{ background: #FFFFFF ;
font-family: arial;
color: #000000;
border-style: solid;
border-color: #000000;
border-width: 5px; }
</style>
Everything that's bolded you left as value; then had the specified object outside of it, when it should have replaced "value." :)
Tjololo 04-12-2004, 09:14 PM Grr...that was my problem...I'll stop doing html at two thirty in the morning from now on...Lol, thanks a lot for the help, I appreciate it.
bourdelson 04-12-2004, 09:20 PM It's no problem at all. :)
PS: Thanks for catching and correcting my mistake, Mirna. :)
|