Skip to content

Lets you add markers to the page scrollbar to indicate the location of key elements on the page for fast scrolling. Inspired by a similar feature on MSNBC.com

Notifications You must be signed in to change notification settings

ChiperSoft/PinScroll

Folders and files

NameName
Last commit message
Last commit date

Latest commit

 

History

3 Commits
 
 
 
 
 
 
 
 
 
 
 
 
 
 

Repository files navigation

PinScroll v0.1
Adds markers to the page scrollbar to indicate the location of key elements on the page.
Inspired by a similar mechanism used on MSNBC.com

-USAGE---------------------------------------------------------------------------------------------------------------

PinScroll requires the presence of Prototype 1.6 or later to function.
Script.aculo.us 1.8 or later is required for animated scrolling.
The css directives inside the included PinScroll.css must be present on the page for the markers to display correctly.

At the bottom of the page body or in an onload/dom:loaded event:

	var myscroller = new PinScroll( anchorElements [, options] );
	
anchorElements is a hashed array object consisting of css selector / object pairs, like so:

	'selector':{ pinContentType (image|selector|element) : pinContent }
	
	pinContent varies according to the pinContentType:
		image: 	  the path to an image file
		selector: a css selector string
		element:  either a DOMElement object or an id string

options is an optional object containing any of the following key/value pairs:
	
	pinTrayTag             Tag type used for creating the pin tray. Default is 'ul'
	pinTrayID              ID name used for the pin tray Default is 'Pintray'
	pinTrayPadding         Space in pixels to appear at the top and bottom of the scrollbar. Default is 10
	pinTrayPaddingTop      Overrides the padding value for the top of the scrollbar
	pinTrayPaddingBottom   Overrides the padding value for the bottom of the scrollbar
	pinTag                 Tag type used for creating the individual pins. Default is 'li'
	loadDelay              Time (in milliseconds) before the pins appear. Default is 1000, minimum is 200
	
	The following values only apply is Scriptaculous is loaded.
	scrollDuration         Time (in seconds) the scrolling animation will take.  Default is 0.5
	fadeInDuration         Time (in seconds) for the fade in animation after page load. Default is 1
	
See the included example.html for usage examples.

-LICENSE---------------------------------------------------------------------------------------------------------------

Copyright (c) 2010, Jarvis Badgley - chiper[at]chipersoft[dot]com

Permission is hereby granted, free of charge, to any person obtaining
a copy of this software and associated documentation files (the
"Software"), to deal in the Software without restriction, including
without limitation the rights to use, copy, modify, merge, publish,
distribute, sublicense, and/or sell copies of the Software, and to
permit persons to whom the Software is furnished to do so, subject to
the following conditions:

The above copyright notice and this permission notice shall be
included in all copies or substantial portions of the Software.

THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND,
EXPRESS OR IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF
MERCHANTABILITY, FITNESS FOR A PARTICULAR PURPOSE AND
NONINFRINGEMENT. IN NO EVENT SHALL THE AUTHORS OR COPYRIGHT HOLDERS BE
LIABLE FOR ANY CLAIM, DAMAGES OR OTHER LIABILITY, WHETHER IN AN ACTION
OF CONTRACT, TORT OR OTHERWISE, ARISING FROM, OUT OF OR IN CONNECTION
WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE SOFTWARE.

About

Lets you add markers to the page scrollbar to indicate the location of key elements on the page for fast scrolling. Inspired by a similar feature on MSNBC.com

Resources

Stars

Watchers

Forks

Releases

No releases published

Packages

No packages published