Scrollbar

[Spunky]

I am attempting to use JavaScript to make a customizable scrollbar rather than trying to customize the browser scrollbar. I found an awesome site that seemingly explains very well how this can be done but I must be missing something as I cannot get it to work. Here is the site: http://livepipe.net/control/scrollbar I copied and pasted the code as it shows on the site. I even have the page linked to my jquery.js file as it seems to be using JQuery. I am getting an error, however: Uncaught ReferenceError: Control is not defined scrollbar.js:3 It is referring to this line:

var scrollbar = new Control.ScrollBar('scrollbar_content','scrollbar_track');

So I tried to dig deeper into the problem. Well, first of all, that link you see on the top right of the page, scrollbar.js, is broken. So I right-clicked and viewed the source of the page. There's no actual file it uses called scrollbar.js but you can clearly see the code is used in script tags. Also there is an additional line:

document.observe('dom:loaded',function(){

So I tried to add that and I get a new error: Uncaught TypeError: Object #<HTMLDocument> has no method 'observe' scrollbar.js:2 (anonymous function) So, it seems that I am missing something, maybe this code doesn't come from the JQuery library? Maybe I need whatever is behind that broken link? Any suggestions? This solution is exactly what I need, maybe there is a similar one out there someone knows of?

[justsomeguy]

That code is for Prototype and Scriptaculous, not jQuery. You can thank the authors of those libraries for all deciding that "$" was the perfect identifier for their main object, as if no one would ever need to combine them. Anyway, all of the code is in their all.js file that you can see linked to in the source. It looks like that file defines all of the various controls they have on their site, including the Control object and its subclasses. If you wanted to separate out just the scrollbar then you would need to un-minify that code and find the parts you need, otherwise they have it packaged and minified. You do need the document.observe line for that to work.

[Spunky]

Dang, so this code is going to be harder to use than expected. It's so perfect though! I did wonder though if I needed that js file they have and copied and pasted it into another file and it didn't seem to do anything. Hmm.

[jeffman]

There are jQuery plugins too.

[Spunky]

Oh cool! Thank you for this. I've been doing Google searches on scrollbars and that solution was the best thing I could come up with. I never thought to include JQuery as one of my search words to come up with this stuff haha.