[FlobinParticipant]

So I too noticed the choppiness of the parallax scrolling background images in some browsers. I tried to fix it through CSS, but whenever I add:

.home .x-content-band.bg-image.parallax {
background-attachment: fixed;
background-position: 50% 30% !important;
}

It causes the first background picture to just stay fixed in place and scroll up with the rest of the page and makes the others disappear.

I also tried setting the scrolling speed to 0 in jquery, but that didn’t seem to fix anything either.

Is there a sure-fire way to fix the choppiness of the parallax scrolling?

My site is 4genderjustice.org, by the way.

Thanks!

[RadModerator]

Hi there,

Thanks for posting in.

I checked and your parallax images are perfectly. What I noticed is that it won’t scroll smoothly, and smooth scrolling extension is not active.

If your smooth scrolling is active from your settings, then what we could be seeing is caches. Please clear the caches your WP Super Cache and deactivate it. Then clear your browser cache too and try private browsing (eg. chrome’s incognito) if possible when testing.

Thanks and let us know.

[FlobinParticipant]

Hi,

Thanks for the response!

I enabled the smooth scrolling, deleted the cache and checked the website in incognito mode. As far as I can see, the scrolling is still not very smooth.

Is there an easy way to just have the background images be fixed in place? I suppose I could just remove the parallax javascript bit, or is there a better way?

[Rue NelModerator]

Hello There,

Please make sure that you are using the latest version of Smooth Scroll (1.0.2). There was a known bug between the latest Chrome 43 and Smooth Scroll (1.0)

To disable the parallax, please edit your page and disable parallax in the content band.

Thanks.

[FlobinParticipant]

I haven’t been able to work on the site for a bit, but now it’s close to launch time, so I’d like to ask for help once more.

When I disable the parallax effect and smooth scrolling plugin, and use css to fixate the background images, they appear strangely or don’t show up at all. And they don’t actually stay fixed in place.

What I did was give the content band a class (homepage-cover-photo) and put

.homepage-cover-photo {
	background-attachment: fixed!important;
}

See: http://4genderjustice.org/

So what can I do to solve this?

Thanks in advance!

[Paul RModerator]

Hi,

Thanks for writing in! Regretfully, at this time I am not entirely certain what it is you would like to accomplish based on the information given in your post. If you wouldn’t mind providing us with a little more clarification on what it is you’re wanting to do (a link to a similar example site would be very helpful, or perhaps some screenshots), we’ll be happy to provide you with a response once we have a better understanding of the situation.

[FlobinParticipant]

Hi, basically I’d like to just use background-attachment: fixed; no js scrolling whatsoever. Here is an example: http://cool-house.nl/index.php (the index.php is important). The images between the sections just stay in place.

Thanks in advance!

[Rue NelModerator]

Hello There,

Please edit your page and edit the content band settings. You should disable parallax to make your background fixed. Please see the screenshot: http://prntscr.com/7dpd42

Please also add this css code:

.home .x-content-band.bg-image{
  background-attachment: fixed;
}

Please let us know how it goes.

[FlobinParticipant]

Hi,

I disabled the parallax effect and added the css, but the result is the same as before: some of the images don’t show up at all, and none of them stay in place as the page scrolls up.

See http://4genderjustice.org/

Edit: things seem to be working well in Firefox, Safari (on OS X), IE9+ (on Windows), but not Chrome and Opera (on OS X), so it would appear to be an issue related to Blink.

[FlobinParticipant]

So after some digging, this appears to be an issue with Chrome. If anyone else is having the same problem, check out this link, because it helped me: https://stackoverflow.com/questions/23571578/chrome-issue-with-background-attachment-fixed-and-position-fixed-elements

[ChristopherModerator]

Thanks for sharing Flobin.
Glad you were able to fix it.

[Author]

Posts