Scaling image in Parallax.js

Question

I apologize in advance for my English, I'm using Parallax.js on my page and I ran into the following problem. The picture that I use to create the parallax has a resolution of 3160x2840 but my screen is 1920x1080. Is it possible to make this photo scale to the screen resolution?

Nabeel Sajid · Accepted Answer · 2021-05-25 11:33:30Z

0

here is a trick, specify class="parallax-image" to your img tag

.parallax-image {
    position: absolute;
    top: 50%;
    left: 50%;
    -ms-transform: translate(-50%, -50%);
    -webkit-transform: translate(-50%, -50%);
    -moz-transform: translate(-50%, -50%);
    -o-transform: translate(-50%, -50%);
    transform: translate(-50%, -50%);
}

other way you can use

width: 100vw

edited May 25, 2021 at 11:33

answered May 25, 2021 at 11:19

Nabeel Sajid

1881 silver badge6 bronze badges

Sign up to request clarification or add additional context in comments.

2 Comments

idk Over a year ago

it doesn't change anything, it looks like it's being ignored

Nabeel Sajid Over a year ago

you can use width: 100vw height: 100vw but it is not recommended

Collectives™ on Stack Overflow

Scaling image in Parallax.js

1 Answer 1

2 Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

2 Comments

Your Answer

Sign up or log in

Post as a guest

Related