ZyngaScroller

jQuery plugin for fast, collaborative kinetic scrolling


Project maintained by TimHeckel Hosted on GitHub Pages — Theme by mattgraham

Fast, easy, and collaborative kinetic scrolling

jQuery.zyngaScroller.js is a jQuery plugin that wraps the excellent Zynga Scroller as a simple jQuery plugin with a couple new additions: (1) Real-time collaboration is now possible by leveraging the SignalR hook baked into the jQuery.signalRamp.js plugin, and (2) the version of EasyScroller.js that this project uses is different than the original Zynga Scroller with collaboration hooks and support for IE8 and above.

Live Demo

Want to see this thing with collaboration turned on? Click here!

Usage

To use the plugin, simply create some HTML that looks like this:

<div id="relativeParent" style="position:relative;width:500px;height:400px;overflow:hidden;">
    <div id="absoluteScroller" style="position:absolute;width:3000px;height:3000px">
    </div>
</div>

Then create the scrolling canvas simply:

$("#absoluteScroller").zyngaScroller();

If you want real-time collaboration, ensure you have a reference to both the jQuery.signalRamp.js file AND the jquery.signaR-1.0.0.js file in your <head>, then instantiate the canvas with the following options:

$("#absoluteScroller").zyngaScroller({
    proxyName: 'uniqueName' //share the SAME proxy name to enable collaboration
    , collab: true //turned off by default
}