colored scroll bars (Full Version)

All Forums >> [Web Development] >> Microsoft FrontPage Help



Message

bob burkett -> colored scroll bars (10/30/2002 12:33:24)

I' m sure it has been asked a bunch of times, but I could not find info when using the search tool.

I would like to change the color of my scroll bar, similar to the blue used on this forum. Where can I learn how to do it, or get the code?



AMysticWeb -> RE: colored scroll bars (10/30/2002 12:46:04)

Here is a script you can play with.
------------
<base target=" _self" >

<style type=" text/css" >
body {scrollbar-face-color: #F1EFDC;
scrollbar-shadow-color: #000077;
scrollbar-base-color: #F1EFDC;
scrollbar-highlight-color: #000077;
scrollbar-3dlight-color: #F1EFDC;
scrollbar-darkshadow-color: #000077;
scrollbar-track-color: #F1EFDC;
scrollbar-arrow-color: #000077;}
</style>
------------
Place this script inbetween your <Head> </Head> tags.

Also, you can download a shareware version of Fungus Scroll Bar Wizard here http://www.orchardhouse.vtrading.co.uk/SBWiz.zip
I have played with this a little. Pretty easy to use.



bob burkett -> RE: colored scroll bars (10/30/2002 12:50:44)

Thanks for the quick response, I' ll check it out.



bobby -> RE: colored scroll bars (10/30/2002 14:08:31)

That can also be placed into a CSS...

It' s IE only, so NN, O, and MZ users won' t be able to see it... shouldn' t cause any problems in those browsers tho!




bob burkett -> RE: colored scroll bars (10/30/2002 15:22:45)

I just pasted it into my pages and changed the colors. It came out great. Thanks again.



bob burkett -> RE: colored scroll bars (10/30/2002 16:42:24)

One last question, I am assuming this is a css script because of the <style type=" text/css" > line. I added the entire code to every page. It' s my understanding that with css, you can make a change to one page and have it format all the pages in a web. If this is true, how would this code look different? Or am I mistaken?



bobby -> RE: colored scroll bars (10/30/2002 16:50:08)

The code above is an inline style... a CSS (Cascading Style Sheet) is an external file in your root web that is linked in the header of each page...

To do the same in CSS:

in html view of a new web page paste the following: 

body {
scrollbar-face-color: #F1EFDC; 
scrollbar-shadow-color: #000077; 
scrollbar-base-color: #F1EFDC; 
scrollbar-highlight-color: #000077; 
scrollbar-3dlight-color: #F1EFDC; 
scrollbar-darkshadow-color: #000077; 
scrollbar-track-color: #F1EFDC; 
scrollbar-arrow-color: #000077;}


Now save as styles.css (there is an option under " save as" for style sheets, or save as an .htm and then right click > rename

Then in your <head> : 

<link rel=" stylesheet"  type=" text/css"  href=" styles.css" >


Now every page that has that link in the header will apply the styles... you can modify all style attributes in a CSS and change every page that it applies to by modifying that one .css file!

For more on CSS go to http://www.w3schools.com and select CSS from the menu on the left...




bob burkett -> RE: colored scroll bars (10/30/2002 17:16:00)

Thanks, I just read the Outfront tutorial on CSS, and I' ll take your code and practice. Thanks again Bobby.



pageoneresults -> RE: colored scroll bars (10/30/2002 20:23:23)

I believe there is also a javascript solution out there for the colored scrollbars which is preferred. Reason being is that the css version is not W3C compliant and you won' t be able to validate your styles. Not that anyone really cares, just thought I' d bring that to your attention. ;)

[url=" http://www.webmasterbase.com/article/643" ]Manipulate Scrollbar Colors using CSS and JavaScript[/url]



bobby -> RE: colored scroll bars (10/31/2002 10:43:01)

POR - is the JS method cross browser compatible? The CSS method is IE only... unless NN7 recognizes..?

quote:

you won' t be able to validate your styles

Is that why it doesn' t work with a loose or strict DTD ?



pageoneresults -> RE: colored scroll bars (10/31/2002 19:34:23)

Bobby, I believe scrollbar colors are an IE creation and therefore not cross browser compatible. The javascript solution would only be helpful in allowing you to validate your css as the javascript is not read with the exception of the javascript attributes.



skillmaster -> RE: colored scroll bars (8/9/2003 20:13:30)

Ok, i aswell need help because i enter this for my scroll bar and it change my text. I took the part where it said" {font: 9pt Arial, sans-serif}" (both of them) out and half of my text color was black and half was it orginal color. Source codes did not have the orginal colors in half of the page so is there anyway i can change this?

<style type=" text/css" >
<!--
* {font: 9pt Arial, sans-serif}
BODY {
background-color: #FFFFFF;
color: #000000;
scrollbar-face-color: #7FAAFF;
scrollbar-highlight-color: #FFFFFF;
scrollbar-shadow-color: #CCCCCC;
scrollbar-3Dlight-color: #CCCCCC;
scrollbar-arrow-color: #AAFFFF;
scrollbar-track-color: #D4FFFF;
scrollbar-darkshadow-color: #999999;
font: 9pt Arial, sans-serif
}

//-->
</style>



Charles W Davis -> RE: colored scroll bars (8/9/2003 21:33:32)

Additional information:

http://www.thetemplatestore.com/help/scrollbars.asp
http://www.boogiejack.com/css004.html
http://www.teshack.com/webdesign/beyond/dhtml/code/coloredscrollbars.asp

The colors should exactly match colors on your site.



igonot -> RE: colored scroll bars (3/25/2004 18:33:21)

Iīve ben reading the solutions about this, but I have a question. Is there any way to apply this kind of properties in a <select> field? I mean, I can already change the colours in the field itself, but canīt do it with arrows & scrolls with in.

Thx



Page: [1]

Valid CSS!




Forum Software © ASPPlayground.NET Advanced Edition 2.4.5 ANSI
0.078125