Skip to main content

Public Methods

The following methods are available on a controller instance

createElement()​

Creates and returns a new parallax element with provided config including props to be managed by the controller.

const options = {
  el: document.querySelector('.your-element'),
  props: { translateY: [-100, 100] },
};
const element = parallaxController.createElement(options);

getElements()​

Returns all the parallax elements in the controller.

const elements = parallaxController.getElements();

updateElementPropsById()​

Updates an existing parallax element with new props.

const newProps = { translateY: [-200, 200] };
parallaxController.updateElementPropsById(element.id, newProps);

removeElementById()​

Removes and element by a given ID

parallaxController.removeElementById(element.id);

resetElementStyles()​

Remove a target elements parallax styles

parallaxController.resetElementStyles(element);

updateScrollContainer()​

Updates the scroll container of the parallax controller.

const el = document.getElementById('your-scroll-container');
parallaxController.updateScrollContainer(el);

disableParallaxController()​

Disables the Parallax Controller.

parallaxController.disableParallaxController();

enableParallaxController()​

Enables the Parallax Controller.

parallaxController.enableParallaxController();

update()​

Updates all cached attributes on parallax elements.

parallaxController.update();

destroy()​

Removes all listeners and resets all styles on managed elements.

parallaxController.destroy();