Parallax Pro Background Images Not Scrolling

[natefancher]

Hello,

I'm trying to get my background images to do that subtle scroll that's so great on the demo. Currently the images are just fixed and not scrolling at all.

I've attached the URL. Thanks so much!

http://indiepodcaster.com

[essaysnark]

Looks like the StudioPress demo for that theme is a different version (1.0.1); you might start by updating the theme. Be sure to take a backup first, especially if you've modified your stylesheet or functions.php, as you'll need to restore those files into the upgraded theme. There's some different CSS in the StudioPress demo (e.g, " background-position: 50% 0px;" in the element but I don't know if that's governing this behavior or not).

If you can't get this behavior and you're certain you have it set up according to the theme instructions, it might be worth sending a request for support on it; the StudioPress staff don't hang around here much.

[natefancher]

Thanks so much! Where did you see that update? I'm not seeing that.

[Tom]

Nate ... have a peek in the style.css file of the current StudioPress demo for Parallax. The version is listed as 1.0.1. The version of the current theme download is still 1.0. The CSS mentioned differs in the placement of the image using the "left" value (0px vs. 50%).

Another difference I found is in the"parallax.js" Javascript across theme examples, pparently to match the CSS difference. The JS seems to produce the same visual result, at lease in my tests. These files are both different from the JS from when the theme originally shipped.

StudioPress Demo:
$(".home-section-1").css("backgroundPosition", "50% " + -(scrolltop/6) + "px");

Nate's Javascript:
$(".home-section-1").css("backgroundPosition", "0px " + -(scrolltop/6) + "px");

I did some testing with these CSS and JS variables, also with your GIF images finding that the differences in CSS and JS do not visually affect the theme scrolling parallax effect. (each combo of 3 Javascript and 2 CSS variables).

While not a solution for you, perhaps it can help narrow down your problem determination to perhaps a conflicting plugin or Javascript snippet or some other configuration. Do let us know how this plays out for you.

---

Choose your next site design from over 350 Genesis themes.
[ Follow me: Twitter ] [ Follow Themes: Twitter ] [ My Favourite Webhost ]

[natefancher]

Thanks so much for the help, Tom! I'm not really a developer and am beginning to get a little overwhelmed by this.
Should I simply deactivate plugins one at a time to test it? It seems the JS should also be changed right? Where can I find ”parallax.js” in WordPress? Is that only accessible on the server via FTP?

I really appreciate the help!

[Tom]

Should I simply deactivate plugins one at a time to test it?

Yes. In particluar "ViperBar", which appears to be causing a JS error. If that fails to fix this, please try disabling your plugins, clear your browser cache, then add them back one by one, testing for this symptom after each.

---

Choose your next site design from over 350 Genesis themes.
[ Follow me: Twitter ] [ Follow Themes: Twitter ] [ My Favourite Webhost ]

[marybaum]

There's actually a faster way to find your misbehaving plugin. My husband and other degreed engineers call it the binary something-or-other - binary extraction, maybe?

I call it The Dance.

1. Start by deactivating all your plugins at once. To keep track of where you are, disable them by moving them into a different folder. Call that folder something like Disabled Plugins. <br />Problem fixed? Good. it really is a bad plugin.
2. Put half of them back into the real plugins folder and activate. Problem back? Your bad plugin is one of these. Deactivate half. <br />Problem still fixed? Deactivate this half and put them into another folder, called maybe disabled-clean. Now activate the other half.
3. Repeat with ever-shrinking halves until you've isolated the offending plugin.

If, for example, you have ten total plugins, you should have your answer in four moves at most. That's why it's a dance instead of a slog . . .

Hope it helps!

MB

---

Sharing the good news about the wonders of modern CSS and the split-step. Either one should get you moving fast. 😀

[Author]

Posts