Permalink
Browse files

Add class animation, and shift control to support it

  • Loading branch information...
1 parent c17d9ed commit 8bd61cc5614f99b5bd1721e4ebd690537b02343a Al committed May 3, 2012
Showing with 46 additions and 6 deletions.
  1. +46 −6 jquery.scroller.js
View
@@ -7,6 +7,50 @@
var Scroller = {};
+ /*
+ * class - add or remove a class
+ *
+ * This animation should be used with `shift` because it relies on a
+ * negative scroll value.
+ *
+ * classname: The name of the class to add when the scroll value becomes
+ * positive, and to remove when it becomes negative. This uses
+ * the jQuery addClass/removeClass functions, so you can specify
+ * multiple classnames using spaces.
+ */
+ Scroller.class = function(classname) {
+ var is_on = false; // this is cheaper than using hasClass
+ return function(event, args) {
+ console.log([args.t, is_on]);
+ if (args.t > 0 && !is_on) {
+ $(this).addClass(classname);
+ is_on = true;
+ }
+ else if (args.t <= 0 && is_on) {
+ $(this).removeClass(classname);
+ is_on = false;
+ }
+ }
+ };
+
+ /*
+ * shift - Shift the scroll position by a number of pixels
+ *
+ * This control is different from `between` because animations will still play
+ * after this one - but they may receive a negative scroll value.
+ *
+ * by: The number of pixels to shift it by. A positive number will cause
+ * later animations to begin that number of pixels of scroll later than
+ * it would have.
+ */
+ Scroller.shift = function(by) {
+ return function(event, args) {
+ args.scroll_top -= by;
+ by *= args.pixel;
+ args.t -= by;
+ }
+ };
+
/*
* parallax - Scroll faster or slower than the page to produce a parallax effect.
*
@@ -60,7 +104,6 @@
return function(event, args) {
var f = from;
var t = to;
- var total_height = t-f;
if (f == 'onscreen') {
f = elem_offset.top - args.view_height;
@@ -69,6 +112,8 @@
t = elem_offset.top + $(this).outerHeight();
}
+ var total_height = t ? t-f : args.scroll_range - f;
+
// Subtract the "from" position from scroll position.
args.scroll_top -= f;
f *= args.pixel;
@@ -170,16 +215,13 @@
});
}
- console.log(setup);
self.css(setup);
start_at = 0;
return function (event, args) {
var t_speed = speed * args.pixel;
- console.log(args);
-
var deg = 360 * (args.t / t_speed) + start_at;
var css = {
@@ -210,8 +252,6 @@
original_values[key] = self.css(key);
});
- console.log(original_values);
-
return function(event, args) {
var css = {};
var t_speed = speed * args.pixel;

0 comments on commit 8bd61cc

Please sign in to comment.