Skip to content

Instantly share code, notes, and snippets.

@jakebellacera
Created May 16, 2012 21:47
Show Gist options
  • Save jakebellacera/2714223 to your computer and use it in GitHub Desktop.
Save jakebellacera/2714223 to your computer and use it in GitHub Desktop.
A basic parallax helper for Scrollorama
/**
* Parallax helper using Scrollorama
*/
var parallax = function () {
var parallax = this,
$scrollorama,
cachedWindowHeight = window.innerHeight();
this.init = function () {
// load scrollorama
parallax.load();
// Bind parallax.reinit() to window.onresize
$window.on('throttledresize.parallax', refreshParallaxOnResize);
function refreshParallaxOnResize () {
// We only want to refresh scrollorama if the window's height changes,
// not the width.
if (cachedWindowHeight !== $window.innerHeight()) {
parallax.refresh();
// Update the cached window height with the new height
cachedWindowHeight = $window.innerHeight();
}
}
};
// Create the scrollorama object
this.create = function () {
var blocks = selector || '.scrollblock';
$scrollorama = new $.scrollorama({
blocks: blocks
});
};
// Load scrollorama with animation queue
this.load = function () {
parallax.create();
parallax.animations();
};
// Re-initialize scrollorama
this.refresh = function () {
$scrollorama.destroy();
parallax.load();
};
// Remove scrollorama completely
this.remove = function () {
$scrollorama.destroy();
$window.off('throttledresize.parallax');
};
this.animations = function () {
// Define animations here
};
};
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment