MooScroll

MooScroll is a MooTools 1.2 class that allows you to customize how the scrollbar looks on scrollable divs.

Syntax:

html:

<link rel="stylesheet" href="css/mooscroll.css" type="text/css" media="all" />
…
<div class="scroll">Content Here</div>
…
<script src="http://www.google.com/jsapi"></script><script>google.load("mootools", "1.2.1");</script>
<script src="js/mootools-1.2-more(slider-drag-scroll)yuic.js" ></script>
<script src="js/MooScroll_0.59.js" ></script>

javascript:

var myScroll = new MooScroll({/*options here*/});

Options:

selector [string]: CSS style selector to determine what elements get MooScrolled. Default = ".scroll"
increment[number]: Number of pixels that are scrolled at a time. Default = 30
handleOpacity [number]: Opacity of scroll handle. Default = 1
handleActiveOpacity [number]: Opacity of scroll handle while it is being dragged. Default = 0.85
disabledOpacity [number]: Opacity of scroll bar when there is not enough content to scroll. Default = 0.5
fullWindowMode[boolean]: Set to true when using a MooScroll area to "replace" the browser scrollbar . Default = false
scrollBarClass [string]: Class of scroll bar div. Default = "scrollBar"
scrollHandleClass [string]: Class of scroll handle wrapper div. Default = "scrollHandle"
scrollHandleBGClass [string]: Class of scroll handle bg div. Default = "scrollHandleBG"
scrollHandleTopClass [string]: Class of scroll handle top div. Default = "scrollHandleTop"
scrollHandleMiddleClass [string]: Class of scroll handle middle div. Default = "scrollHandleMiddle"
scrollHandleBottomClass [string]: Class of scroll handle bottom div. Default = "scrollHandleBottom"
scrollControlsYClass[string]: Class of wrapper div around vertical scroll controls. Default = "scrollControlsY"
restrictedBrowsers[array]: Uses MooTools Browser Hash to disable MooScroll for certain browsers. Default = [Browser.Engine.presto925, Browser.Platform.ipod, Browser.Engine.webkit419] //Opera 9.25 or lower, Safari 2 or lower, iPhone/iPod Touch
smoothMooScroll [object]
- toAnchor [boolean]: When true, scrolls the MooScrollArea smoothy to the anchor when a link to the anchor is clicked. Default = true
- toMooScrollArea [boolean]: When true, scrolls the window to the MooScrollArea when a link to an anchor inside the MooScrollArea is clicked. Default = true

Functions:

refresh(): When called will adjust the scrollbar according to the current MooScroll object size and content.
loadContent(contentString): When called will update content of MooScroll object with the passed in string and then refresh the scrollbar.
setSlider(target): When called will scroll the MooScrollArea to the passed in target value. Accepts a number or the keywords ‘bottom’ or ‘top’.