Skip to content

Instantly share code, notes, and snippets.

@johanneseckert
Created November 5, 2013 23:41
Show Gist options
  • Save johanneseckert/7328363 to your computer and use it in GitHub Desktop.
Save johanneseckert/7328363 to your computer and use it in GitHub Desktop.
parallaxing purchase window in Javascript for Article Preview Prototype
// positionNow is the current X offset of the vertical scrollable frame
purchaseWindow.originalX: (screenWidth - purchaseWindow.width)/2 // centered position of purchase Window
// parallax purchaseWindow
parallaxPurchaseWindow = function(min,visibility) {
// visibility (true/false) determines if we offset it by screenWidth;
if (visibility)
offset = screenWidth;
else
offset = 0;
purchaseWindowX = ((positionNow - min)*-1) + offset;
// https://medium.com/building-potluck/2e405d50b600
parallaxOffset = Math.round(utils.map_range(purchaseWindowX, -2048, 2048, purchaseWindow.originalX, purchaseWindow.originalX*-1));
purchaseWindow.x = purchaseWindowX + purchaseWindow.originalX + parallaxOffset;
console.log("purchaseWindowX: "+purchaseWindowX+" ~ parallaxOffset: "+parallaxOffset);
};
utils.map_range = function(value, low1, high1, low2, high2) {
if (value < low1) { return low2; }
else if (value > high1) { return low2; }
else return low2 + (high2 - low2) * (value - low1) / (high1 - low1);
}
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment