jQuery Forum

Hi y'all,

First post here. After coming across a lot of jQuery while googling and realising it's potential, I was completely converted to using it.
That wasn't too long ago but I've been reading up and experimenting...
After creating a few parallax images, I started looking for a good smooth scrolling solution.
Not finding a satisfying answer, I went ahead and wrote something myself :

1. $(document).ready(function() {
   
   $(window).resize(function() {edge = ($(document).height()-$(window).height())});
2. 
   
3. var edge = ($(document).height()-$(window).height();
   var turned = 0;
   var flow;
   var prospect;
   var sequence;
   
       $('html, body').mousewheel(function(event, delta) {
   
       var motion = 125;
       var leap = 1.35;
       var timespan = 500;
       var sloth = 1.25;
       var limit = 5;
       var reset = 85;
       var method = 'easeOutQuad';
   
       var outset = $(window).scrollTop();
       var scroll = true;
       var direction = delta;
       var brake = turned-1;
   
           if (delta == -1 && outset == edge || delta == 1 && outset == 0) scroll = false;
           if (scroll) {
           turned = turned+1;
           if (turned > 2 && direction != flow) turned = turned-brake;
           if (turned > limit) turned = limit;
   
       var distance = -delta*motion*Math.pow(leap, (turned-1));
       var term = timespan*Math.pow(sloth, (turned-1));
       var destination = outset+distance;
   
           $('html, body').stop(true).animate({scrollTop: destination}, {
               start: function() {
                   flow = direction;
               },
               duration: term,
               easing: method,
               progress: function(prospect, sequence) {
                   if (100*sequence >= reset) turned = 0;
                   if ((destination > edge && $(window).scrollTop() == edge)
                   || (destination < 0 && $(window).scrollTop() == 0))
                   {$('html, body').stop(true, true); turned = 0}
               }
           });
           }
   
       return false;
       });
   });

http://ataredo.com/morphology/lucidscroll/

Works like a charm, especially with the help from mousewheel.js and special easing.

Then I got motivated and created this elaborate test page :

http://ataredo.com/morphology/lucidtest/

All the variables can be adjusted and tried out there.

Bunch of data is available as well and it even has a live graphic stream...

Hope you like it! Very entertaining and educational to myself at least.