- This topic is empty.
-
AuthorPosts
-
August 23, 2016 at 1:45 am #244804
mlithvall
ParticipantHi,
I’m creating a website with parallax effect and have one quite long “About” section with an image as a background. The parallax effect makes this backgorund scale up so it looks pixelated while the resolution works when I’ve tried to set the background image to “contain” (tried in “inspect elements” as I can’t seen to change the background size in visual composer, where the background seems to be set to “cover” by default)
Is there any way to set this background to “contain” and make the parallax effect move faster in this specific section so it fits into the background? I’ve been looking at the code and when I change:.no-touch .header-parallax > .header-bg-wrapper > .header-bg:not(.header-carousel-wrapper), .no-touch .header-parallax > .header-bg-wrapper > .header-bg.header-carousel-wrapper .t-background-cover {
height: calc(100% + 200vh);
}element.style {
background-image: url(http://mlithvall.com/wp-content/uploads/2015/06/estland_bakgrund_2.jpg);
background-repeat: no-repeat;
background-position: center top;
background-size: contain;
}it helps a bit but I end up with a “white space” at the bottom of my section as “200vh” doesn’t seem to be enough of speed (and I can’t put in a higher value – is there a limit somewhere?) Plus if I change the parallax effect like this, it effects all my parallax effects.. I’ve named my background a div class to be “aboutbackground”.
How do I get this to work?!
Here’s a link to my site: http://mlithvall.com/?page_id=21524&preview_id=21524&preview_nonce=26316dca7c&_thumbnail_id=-1&preview=true
Best,
Madeleine -
AuthorPosts
- The forum ‘CSS’ is closed to new topics and replies.