How Can I Move the Web Browsers Scrollbar and Style It (CSS)?

Posted by ThatMacLad on Stack Overflow See other posts from Stack Overflow or by ThatMacLad
Published on 2010-05-23T20:17:56Z Indexed on 2010/05/23 20:20 UTC
Read the original article Hit count: 156

Filed under:

css

|

scrollbar

Upon visiting the site that I'm currently working on you would immediately notice the fact that a bar placed at the top of your browser follows you down as you scroll through the blogs posts. I was wondering if there was any method which I could use to both shift the scrollbar below the bar rather than beside it and then style the bar to suit the sites style.

Image: alt text

© Stack Overflow or respective owner

Related posts about css

HTMLUNIT Facebook javascript warning

as seen on Stack Overflow - Search for 'Stack Overflow'
Hi I am trying to create simple application that would be able to search people on facebook using given e-mail. I am already able to log into an account using the HTMLunit tool and even create a page, which should throw result of my search. But when I try to print the result as XML the file is missing… >>> More
$this->headLink() includes duplicated script

as seen on Stack Overflow - Search for 'Stack Overflow'
Hi, Just like I did before, I used the following code for my new project. <?=$this->headLink()->appendStylesheet('/Layouts/admin/css/button.css');?> <?=$this->headLink()->appendStylesheet('/Layouts/admin/css/inputText.css');?> <?=$this->headLink()->appendStylesheet('/Layouts/admin/css/fancyTable… >>> More
How much multiple style sheets slow down to website?

as seen on Stack Overflow - Search for 'Stack Overflow'
Here is 3 css file (one is only for IE) <link rel="stylesheet" href="css/blueprint/screen.css" type="text/css" media="screen, projection"> <link rel="stylesheet" href="css/blueprint/print.css" type="text/css" media="print"> <!--[if lt IE 8]><link rel="stylesheet" href="css/blueprint/ie… >>> More
mod_pagespeed is rewriting but not combining

as seen on Stack Overflow - Search for 'Stack Overflow'
I have the following problem. I installed mod_pagespeed but i am not getting the results i want! It does rewrite my css and changes the to the cache url but its not combining the css files. I have seached the web and stackoverflow for it but did not find a solution. Here are the tags <link… >>> More
CSS import or multiple CSS files

as seen on Stack Overflow - Search for 'Stack Overflow'
I originally wanted to include a .css in my HTML doc that loads multiple other .css files in order to divide up some chunks of code for development purposes. I have created a test page: <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional… >>> More

Related posts about scrollbar

Scrollbar within a scrollbar only make the inner scrollbar jump to id

as seen on Stack Overflow - Search for 'Stack Overflow'
I have a page that requires a scrollbar - http://www.aus-media.com/dev/site_BYJ/schedule-pricing/pricing.html You will notice (unless you are running at a high resolution with a big screen) that there is an outer scrollbar for the main page as well as an inner scrollbar for the content. When you… >>> More
[WPF]: Styling a scrollbar, but the ListView scrollbar is not affected by the style

as seen on Stack Overflow - Search for 'Stack Overflow'
I am styling a scrollbar in a resourceDictionary without giving it a key value: <Style TargetType="{x:Type ScrollBar}"> ... </Style> Bur for some reason only a component of the type Scrollbar are affected by the style. Not the ListView component's scrollbar! I would Think that… >>> More
Scrollbar of DIV with position FIXED is partly hidden behind window scrollbar

as seen on Stack Overflow - Search for 'Stack Overflow'
I have a table of contents in my page (see here) with these CSS styles: div.toc { height:38em; position:fixed; right:0; top:5em; width:21em; z-index:1; } How do I have to change these settings to make sure the DIV isn't partially hidden behind the body/window scroll bar… >>> More
Wpf binding to a function

as seen on Stack Overflow - Search for 'Stack Overflow'
I've a created a simple scrollviewer (pnlDayScroller) and want to have a separate horizontal scrollbar (associated scroller) to do the horizontal scrolling. All works with the below code accept I need to bind the visibility of the associated scroller. I can't simply bind this to the visibility… >>> More
Why Chrome does not show CSS3 ::-webkit-scrollbar scrollbar for iframe?

as seen on Stack Overflow - Search for 'Stack Overflow'
Why Chrome does not show CSS3 ::-webkit-scrollbar scrollbar for iframe? Demo http://jsfiddle.net/laukstein/C9s3P/ <iframe scrolling="yes" style="overflow-x:hidden; overflow-y:scroll; width:150px; height:50px;" src="http://en.wikipedia.org/wiki/Web_browser"></iframe> CSS ::-webkit-scrollbar{ … >>> More