Download
This module hides default scrollbars and replaces them with autohiding, simpler scrollbars, like those found in OSx.

An element can be made scrollable by passing it as a perameter to the Scroll function { Scroll($('#mydiv')) }

The Scroll function makes an object, so it is best to store this as a variable { myscroll = new Scroll($('#mydiv')) }

Content can be added to the Scroll by either:
- Using .Add() to return the content element { myscroll.Add().html('my html') }
- Accessing the content element through { myscroll.eDict.content }
- Finding the content element within the original element { $('#mydiv').find('.content') }

When the content is changed, the Scroll will be updated, this can also be done manually with { myscroll.Update() }
The Scroll will only show scrollbars for the overflowing dimensions. See the examples.


Example Code: myscroll1 = new Scroll($('#scroll1')) myscroll1.Add().html( "<div style=width:200px;height:200px; >This element is bigger in both height and width</div>" ) myscroll2 = new Scroll($('#scroll2')) myscroll2.Add().html( "<div style=width:200px;height:100px; >This one is bigger in width only.</div>" ) myscroll3 = new Scroll($('#scroll3')) myscroll3.Add().html( "<div style=width:100px;height:200px; >Whereas this element is too tall.</div>" ) myscroll4 = new Scroll($('#scroll4')) myscroll4.Add().html( "<div >And this element is the same size as its parent</div>" )