smoovy icon indicating copy to clipboard operation
smoovy copied to clipboard

@smoovy/parallax

Open paullangton opened this issue 1 year ago • 1 comments

Hi, just to let you know I tried to run the parallax package today using the following:

import { queryEl } from '@smoovy/utils';
import { Parallax, parallax } from '@smoovy/parallax';


parallax({
	speed: { y: -2 },
	element: queryEl('.box0'),
	onUpdate: (state, progress) => {
		console.log('current progress', progress * 100);
		console.log('current shift', state.shiftY);
	}
});
  
  const update = () => {
	Parallax.update({
	  scrollX: window.scrollX,
	  scrollY: window.scrollY,
	  maxWidth: document.body.offsetWidth,
	  maxHeight: document.body.offsetHeight,
	  viewWidth: window.innerWidth,
	  viewHeight: window.innerHeight
	});
  }
  
  window.addEventListener('scroll', () => update());
  requestAnimationFrame(() => update());

state.shiftY returns as expected but progress returns 'NaN' in the console.

paullangton avatar Apr 05 '24 20:04 paullangton

Hey @paullangton, I probably just forgot to update the README, but the progress has x and y properties too, so it should be progress.y * 100 instead of progress * 100. Thanks for mentioning it, I'll update it soon!

davideperozzi avatar Apr 05 '24 22:04 davideperozzi