Forum Hosting  

Go Back   Forum Hosting > IPB Support > IPB Skinning Help
Reload this Page How to Change the Scroll bar color
Register fBuck$ / fStore ProjectsBlogs Members List Mark Forums Read

IPB Skinning Help Need help customizing the looks of your forum? Post here.


Reply
 
LinkBack Thread Tools Display Modes
Old 01-08-2006, 09:29 PM   #1 (permalink)
Senior Forumer
 
leogeckoaddic's Avatar
 
Join Date: Apr 2005

Location: In Your Closet..... With a Real Large Knife
Posts: 1,127
Rep Power: 5 leogeckoaddic is on a distinguished road
fTrader: (7)
fBuck$: 7,506
Bank: 0
Total fBuck$: 7,506

My Forumer
My Country:
Send a message via AIM to leogeckoaddic Send a message via Yahoo to leogeckoaddic
Default How to Change the Scroll bar color
i would like to think that i am well versed in CSS, but for the life of me i cannot get the scroll bar to ever change, i have tried alot of things, it remains the same.


Quote:
BODY { font-family: Verdana, Tahoma, Arial, sans-serif; font-size: 11px; color: #000; margin:0px;padding:0px;background-color:#FEE8C6; text-align:center; background-attachment:scroll; scrollbar-track-color:FFE179; scrollbar-face-color:FFAD39; scrollbar-highlight-color:FF9601; scrollbar-base-color:FF9601; scrollbar-darkShadow-color:FF9601; scrollbar; shadow-color:FF9601; scrollbar-arrow-color:C57401; }
I am trying to add the orange section to the body, but it will not take. I can even make myspace take this and work on there just fine. For months now, i have tried and failed at various variations of this.

What could i be doing wrong with this?

leogeckoaddic is offline   Reply With Quote
Old 01-09-2006, 11:55 PM   #2 (permalink)
Banned User
 
Inny's Avatar
 
Join Date: Sep 2005

Posts: 1,082
Rep Power: 0 Inny is on a distinguished road
fTrader: (1)
fBuck$: 7,846
Bank: 364
Total fBuck$: 8,211

My Forumer
My Country:
Default Re: How to Change the Scroll bar color
css change scrollbar

document.body.style.scrollbarFaceColor="colorname"
document.body.style.scrollbarArrowColor="colorname"
document.body.style.scrollbarTrackColor="colorname"
document.body.style.scrollbarShadowColor="colorname"
document.body.style.scrollbarHighlightColor="colorname"
document.body.style.scrollbar3dlightColor="colorname"
document.body.style.scrollbarDarkshadowColor="colorname"





or You can use javascript, this one cycles colors of scrollbar.

<!--Simply copy and paste it into The <Body> of Your Document.-->

<script type="text/javascript">
// Visit http://rainbow.arch.scriptmania.com/scripts/
// for this script and many more

var counter=0;
function scroll(){
switch(counter){
case 0:
{
document.body.style.scrollbarFaceColor="red";
counter++;
break;
}
case 1:
{
document.body.style.scrollbarFaceColor="orange";
counter++;
break;
}
case 2:
{
document.body.style.scrollbarFaceColor="yellow";
counter++;
break;
}
case 3:
{
document.body.style.scrollbarFaceColor="green";
counter++;
break;
}
case 4:
{
document.body.style.scrollbarFaceColor="blue";
counter++;
break;
}
case 5:
{
document.body.style.scrollbarFaceColor="indigo";
counter++;
break;
}
case 6:
{
document.body.style.scrollbarFaceColor="violet";
counter=0;
break;
}
}

}
setInterval("scroll()",1000)
</script>

onmouseover color change script

</script></center>

<script language="JavaScript1.2">
<!--

//onMouseover Scrollbar effect- by Svetlin Staev (svetlins@yahoo.com)
//Submitted to Dynamic Drive
//Visit http://www.dynamicdrive.com for this script

/*---------------[IE 5.5 Scrollbars colorer]--------------------*/
function scrollBar(line,face,theme)
{
if (!line||!face)
{
line=null;
face=null;
switch(theme) // Predefined themes
{
case "blue":
var line="#78AAFF";
var face="#EBF5FF";
break;
case "orange":
var line="#FBBB37";
var face="#FFF9DF";
break;
case "red":
var line="#FF7979";
var face="#FFE3DD";
break;
case "green":
var line="#00C600";
var face="#D1EED0";
break;
case "neo":
var line="#BC7E41";
var face="#EFE0D1";
break;
}
}

with(document.body.style)
{
scrollbarDarkShadowColor=line;
scrollbar3dLightColor=line;
scrollbarArrowColor="black";
scrollbarBaseColor=face;
scrollbarFaceColor=face;
scrollbarHighlightColor=face;
scrollbarShadowColor=face;
scrollbarTrackColor="#F3F3F3";
}
}

/*------------------[Pointer coordinates catcher]---------------*/
function colorBar(){
var w = document.body.clientWidth;
var h = document.body.clientHeight;
var x = event.clientX;
var y = event.clientY;
if(x>w||y-3>h) scrollBar('#000080','#BFDFFF'); // Your colors
else scrollBar(null,null,"neo"); // A predefined theme
}

if (document.all){
scrollBar(null,null,"neo");
document.onmousemove=colorBar;
}

function offscreen(){
scrollBar(null,null,"neo");
}

document.onmouseout=offscreen;
//-->
</script>

or try

<style>
<!--
BODY{
scrollbar-face-color:#8080FF;
scrollbar-arrow-color:#FFFFFF;
scrollbar-track-color:#DDDDFF;
scrollbar-shadow-color:'';
scrollbar-highlight-color:'';
scrollbar-3dlight-color:'';
scrollbar-darkshadow-Color:'';
}
-->
</style>
Last edited by Inny; 01-10-2006 at 12:16 AM.
Inny is offline   Reply With Quote
Old 01-10-2006, 01:16 PM   #3 (permalink)
Senior Forumer
 
leogeckoaddic's Avatar
 
Join Date: Apr 2005

Location: In Your Closet..... With a Real Large Knife
Posts: 1,127
Rep Power: 5 leogeckoaddic is on a distinguished road
fTrader: (7)
fBuck$: 7,506
Bank: 0
Total fBuck$: 7,506

My Forumer
My Country:
Send a message via AIM to leogeckoaddic Send a message via Yahoo to leogeckoaddic
Default Re: How to Change the Scroll bar color
it just does not work on forumer forums. I dont know if there is a special command or something like that.

I even tried a generator to ensure my coding is correct http://www.csscreator.com/version1/index.php This will let me test it on sites once i put the html color codes in, which works on other sites, but the moment i put in a ipb forum, it does not show up at all.

leogeckoaddic is offline   Reply With Quote
Old 01-10-2006, 01:21 PM   #4 (permalink)
Active Forumer
 
Iyeru's Avatar
 
Join Date: Jul 2005

Posts: 326
Rep Power: 4 Iyeru is on a distinguished road
fTrader: (0)
fBuck$: 2,220
Bank: 0
Total fBuck$: 2,220

My Forumer
My Country:
Default Re: How to Change the Scroll bar color
All the 6 digit hex codes need pound symbols before them, and change your

scrollbar;shadow-color:FF9601;

to

scrollbar-shadow-color:#FF9601;

I've done it many times before on IPB, and it worked... maybe forumer is different. o_O

Banned FMODS.com Member
Do not give me support I do not already know...
Iyeru is offline   Reply With Quote
Old 01-10-2006, 01:39 PM   #5 (permalink)
Senior Forumer
 
leogeckoaddic's Avatar
 
Join Date: Apr 2005

Location: In Your Closet..... With a Real Large Knife
Posts: 1,127
Rep Power: 5 leogeckoaddic is on a distinguished road
fTrader: (7)
fBuck$: 7,506
Bank: 0
Total fBuck$: 7,506

My Forumer
My Country:
Send a message via AIM to leogeckoaddic Send a message via Yahoo to leogeckoaddic
Default Re: How to Change the Scroll bar color
Quote:
Originally Posted by Iyeru
All the 6 digit hex codes need pound symbols before them, and change your

scrollbar;shadow-color:FF9601;

to

scrollbar-shadow-color:#FF9601;

I've done it many times before on IPB, and it worked... maybe forumer is different. o_O
tried with and without the pound symbol i even created

.scrollbar{ scrollbar-track-color:#FFE179; scrollbar-face-color:#FFAD39; scrollbar-highlight-color:#FF9601; scrollbar-base-color:#FF9601; scrollbar-darkShadow-color:#FF9601; scrollbar; shadow-color:#FF9601; scrollbar-arrow-color:#C57401; }

in the css script part and then in the main html section, where the logo is located, i put <DIV class="scrollbar"> in there. It still does not work.

i also tried <DIV STYLE="scrollbar-track-color:#FFE179; scrollbar-face-color:#FFAD39; scrollbar-highlight-color:#FF9601; scrollbar-base-color:#FF9601; scrollbar-darkShadow-color:#FF9601; scrollbar; shadow-color:#FF9601; scrollbar-arrow-color:#C57401;"> </div> still did not work

And now the server is down

leogeckoaddic is offline   Reply With Quote
Old 01-10-2006, 02:47 PM   #6 (permalink)
Senior Forumer
 
leogeckoaddic's Avatar
 
Join Date: Apr 2005

Location: In Your Closet..... With a Real Large Knife
Posts: 1,127
Rep Power: 5 leogeckoaddic is on a distinguished road
fTrader: (7)
fBuck$: 7,506
Bank: 0
Total fBuck$: 7,506

My Forumer
My Country:
Send a message via AIM to leogeckoaddic Send a message via Yahoo to leogeckoaddic
Default Re: How to Change the Scroll bar color
GRRRR, i think it will not work on ipb forum. The css generator that will do a preview of the page i want to alter, does not alter the color of the scroll bar on a ipb forum, but a phpbb forum it does......

leogeckoaddic is offline   Reply With Quote
Old 01-11-2006, 11:34 AM   #7 (permalink)
Active Forumer
 
Iyeru's Avatar
 
Join Date: Jul 2005

Posts: 326
Rep Power: 4 Iyeru is on a distinguished road
fTrader: (0)
fBuck$: 2,220
Bank: 0
Total fBuck$: 2,220

My Forumer
My Country:
Default Re: How to Change the Scroll bar color
The scrollbar code edits the scrollbars of textboxes... but it shouldn't do that, as the textboxes are a different style. o_O

Banned FMODS.com Member
Do not give me support I do not already know...
Iyeru is offline   Reply With Quote
Old 01-11-2006, 03:52 PM   #8 (permalink)
Active Forumer
 
Iyeru's Avatar
 
Join Date: Jul 2005

Posts: 326
Rep Power: 4 Iyeru is on a distinguished road
fTrader: (0)
fBuck$: 2,220
Bank: 0
Total fBuck$: 2,220

My Forumer
My Country:
Default Re: How to Change the Scroll bar color
I found out the problem...

put the scroll bar css stuff into the html css part. That'll clear it up.

EXAMPLE:

Code:
html { overflow: x-axis; scrollbar-base-color: dimgray; }
so there you go. :P

Banned FMODS.com Member
Do not give me support I do not already know...
Iyeru is offline   Reply With Quote
Old 01-12-2006, 04:35 PM   #9 (permalink)
Senior Forumer
 
leogeckoaddic's Avatar
 
Join Date: Apr 2005

Location: In Your Closet..... With a Real Large Knife
Posts: 1,127
Rep Power: 5 leogeckoaddic is on a distinguished road
fTrader: (7)
fBuck$: 7,506
Bank: 0
Total fBuck$: 7,506

My Forumer
My Country:
Send a message via AIM to leogeckoaddic Send a message via Yahoo to leogeckoaddic
Default Re: How to Change the Scroll bar color
Quote:
Originally Posted by Iyeru
I found out the problem...

put the scroll bar css stuff into the html css part. That'll clear it up.

EXAMPLE:

Code:
html { overflow: x-axis; scrollbar-base-color: dimgray; }
so there you go. :P
Thank you!

That finally worked, i was beating my brain in trying to figure out what i am doing wrong.

leogeckoaddic is offline   Reply With Quote
Old 01-12-2006, 06:39 PM   #10 (permalink)
Active Forumer
 
Iyeru's Avatar
 
Join Date: Jul 2005

Posts: 326
Rep Power: 4 Iyeru is on a distinguished road
fTrader: (0)
fBuck$: 2,220
Bank: 0
Total fBuck$: 2,220

My Forumer
My Country:
Default Re: How to Change the Scroll bar color
However, on a normal webpage, the scrollbar css should go into the BODY css part. But if that doesn't work, as indicated here, just put it into the html part. :P

Banned FMODS.com Member
Do not give me support I do not already know...
Iyeru is offline   Reply With Quote
Old 01-12-2006, 06:53 PM   #11 (permalink)
Senior Forumer
 
leogeckoaddic's Avatar
 
Join Date: Apr 2005

Location: In Your Closet..... With a Real Large Knife
Posts: 1,127
Rep Power: 5 leogeckoaddic is on a distinguished road
fTrader: (7)
fBuck$: 7,506
Bank: 0
Total fBuck$: 7,506

My Forumer
My Country:
Send a message via AIM to leogeckoaddic Send a message via Yahoo to leogeckoaddic
Default Re: How to Change the Scroll bar color
Quote:
Originally Posted by Iyeru
However, on a normal webpage, the scrollbar css should go into the BODY css part. But if that doesn't work, as indicated here, just put it into the html part. :P
Yea i figured that, thats why i was going nuts for months on this. I also found that the html {} works for some other things that will not accept the scrollbar in it as well.

leogeckoaddic is offline   Reply With Quote
Reply

« Previous Thread | Next Thread »

Currently Active Users Viewing This Thread: 1 (0 members and 1 guests)
 
Thread Tools
Display Modes
Linear Mode Linear Mode

Posting Rules
You may not post new threads
You may not post replies
You may not post attachments
You may not edit your posts
BB code is On
Smilies are On
[IMG] code is On
HTML code is Off
Trackbacks are On
Pingbacks are On
Refbacks are On
Forum Jump

Similar Threads
Thread Thread Starter Forum Replies Last Post
change my scroll bar color rtk-killer Graphics and Web Design (free) 5 12-24-2005 07:40 PM
How to change color Ashka phpBB2 skinning Help 8 10-08-2005 08:53 PM
how to change scroll bar color nashtumiwa IPB Skinning Help 1 03-03-2005 10:39 PM
Scroll Bar Color sphony IPB General Support 6 08-12-2004 12:02 PM
How Can I Change The Look Of The Scroll Bar? Ice Cool IPB Skinning Help 1 06-24-2004 07:06 AM