pixelcog/parallax.js

adjusting background-size

Closed this issue · 2 comments

Hi,

I'm trying to achieve a background-size: contain while it seems that the default of parallaxJs is to stretch the image, something like background-size: cover.

How do I achieve this?

this is unfortunately not possible due to the nature of the parallax effect.

The plugin calculates the necessary size of the image (i.e. slider) based on the height of the "window" (i.e. how high is the element through which you see the parallax effect), the height of the document (how far can the user scroll while the windows is still visible, assuring that the image doesn't move too far to expose the background behind it) and the speed of the parallax settings (how far does the image/slider move in relation to scrolling speed).

To make sure, the important part of the image is visible you need to either change the aspect ratio of the image, or the aspect ratio of the window, or you create an image which has enough "headspace" around the object you want to show.

Hope this helps!

did this answer your question? please reopen or head to stackoverflow for further questions.