Colored scroll bar for browser

Asked By sasi rekha
20-Nov-08 06:06 AM
Earn up to 0 extra points for answering this tough question.
how to get required color scroll bar for my browser

  re

Web Star replied to sasi rekha
20-Nov-08 06:26 AM

use css for color scroll bar

<style type="text/css">
BODY{
scrollbar-face-color:#DFFFBF;
scrollbar-shadow-color:green;
}
</style>

  Colored scroll bar

mv ark replied to sasi rekha
20-Nov-08 06:29 AM
To get a colored scroll bar for a webpage, you can adapt this CSS class -

body {scrollbar-3dlight-color:#ffd700;
scrollbar-arrow-color:#ff0;
scrollbar-base-color:#ff6347;
scrollbar-darkshadow-color:#ffa500;
scrollbar-face-color:#008080;
scrollbar-highlight-color:#ff69b4;
scrollbar-shadow-color:#f0f}

For more info & example, check this link - http://websitetips.com/articles/css/scrollbars/

Note that these may not be supported on all browsers.

If you need a colored scrollbar for your complete browser & not just for specific pages, you could try this Firefox addon -
https://addons.mozilla.org/en-US/firefox/addon/3699

  i used this code..but giving errors

sasi rekha replied to Web Star
20-Nov-08 07:33 AM
i used this code in masterpagse.i wrote this code before </hear>tag
but giving error saying that these are not a valid CSS property names
  yes
Web Star replied to sasi rekha
20-Nov-08 08:00 AM

u write </hear>tag

this is not valid

</head> is valid one

  before </head> tag
sasi rekha replied to Web Star
20-Nov-08 08:29 AM
sorry Aravind i typed worngly..i placed the below code
<style type="text/css">
BODY{
scrollbar-face-color:#DFFFBF;
scrollbar-shadow-color:green;
}
</style>
before </head>tag..but saying these are not valid CSS properties..wat is the solution
  reply
Binny ch replied to sasi rekha
20-Nov-08 11:25 AM

 Use the following before the </HEAD>

<style type="text/css">
html
    {
        scrollbar-face-color:#DFFFBF;
        scrollbar-shadow-color:green;
    }
</style>

 The Entire code would look like:

<%@ Master Language="C#" AutoEventWireup="true" CodeFile="MasterPage.master.cs" Inherits="MasterPages_MasterPage" %>

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">

    <title></title>
    <asp:ContentPlaceHolder id="head" runat="server">
    </asp:ContentPlaceHolder>
    <style type="text/css">
html
    {
        scrollbar-face-color:#DFFFBF;
        scrollbar-shadow-color:green;
    }
</style>
</head>
<body>
    <form id="form1" runat="server">
    <div>
        <asp:ContentPlaceHolder id="ContentPlaceHolder1" runat="server">
       
        </asp:ContentPlaceHolder>
    </div>
    </form>
</body>
</html

  reply
Binny ch replied to sasi rekha
20-Nov-08 11:26 AM
The CSS like this in head tag would work perfectly for IE but in firfox it will not work.
<style type="text/css">
html
    {
        scrollbar-face-color:#DFFFBF;
        scrollbar-shadow-color:green;
    }
 Firefox does not support this, and it is unlikely to change as this is a deliberate design decision by the firefox development team. There is no workaround, unfortunately.
  Try this to get diifernt coloures scrollbar
Binny ch replied to sasi rekha
20-Nov-08 11:28 AM

Insert the following in your HTML page to change the scrollbars:

<style>
body {
scrollbar-base-color: #0025CC;
scrollbar-arrow-color: #00E81B;
scrollbar-3dlight-color: #C64C00;
scrollbar-darkshadow-color: #00A889;
scrollbar-face-color: #00ED5E;
scrollbar-highlight-color: #DD00C0;
scrollbar-shadow-color: #050066;
scrollbar-track-color: #093800;
}
</style>

Create New Account