• 0

DMS 2 Setting Parallax backgrounds to canvas located the content area does not work


Question

Posted · Report post

Welp - I have been trying for the last 3 or so hours to get the background images to parallax. It seems like it will work if the canvas areas I am trying to set the Parallaxing background to are in the footer area - but not in the page template's content area for some reason. Any idea how to get parallaxing backgrounds to work in the content area of the page template? - I don't want these sections on every page globally.

 

Thanks,

 

- Dave

Share this post


Link to post
Share on other sites

13 answers to this question

  • 0

Posted · Report post

What have you done so far?    Do you have a link?

 

This doesn't give you the cooler...slightly moving effect but you could use the code below.  That will make your section background stay put while the text or whatever scrolls.  Check it on mobile though to make sure it still sizes okay.

 

#pl_areaYOURAREAIDHERE {
  background-attachment: fixed;
}
1 person likes this

Share this post


Link to post
Share on other sites
  • 0

Posted · Report post

Here is the site I am referring to: http://new.promontoryclub.com

 

Here is what I am doing: 

 

Step 1: put a new canvas area in the content area of the page template. 

Step 2: Assign a background image (jpg or png) to the canvas area.

Step 3: Change the Area Styling > Scrolling effects and sizing to Parallaxed background image.

Step 4: Save settings. 

Step 5: Refresh the page after seeing the green dot. 

Step 6: Curse at the site cause it doesn't work. Check settings and they are saved properly. Left scratching head and frustrated. 

 

BUT - if I do the same exact steps but put the canvas area in the Footer or Header area - it works fine. 

 

The problem with adding it to the Footer is I don't want those sections to display globally throughout the site. I only want them to display on the home page. 

 

This has got to be a bug that others are having as well. I get the same results on 2 different websites I am building. Any idea when this bug will be fixed? 

Share this post


Link to post
Share on other sites
  • 0

Posted · Report post

Hi Dave,

 

So after viewing your site, am I right in assuming that you all those Canvas areas with the background images are supposed to have a parallax effect ? If this is the case, I have already reported this to our tracker. It would appear that if you have more than one Canvas section active on your template/page and each of them are configured to use the parallax effect, the effect only works on the first Canvas area and not the others.

 

 

Share this post


Link to post
Share on other sites
  • 0

Posted · Report post

Hey Danny - Yes that is correct.

 

I actually put them all in the footer area so that I can show a client how it is going to work for a meeting I have with them this morning. So if you go to the site you will see that the first few sections actually perform the parallax as they are supposed to. After the meeting I will move those sections to the content area again so we can troubleshoot this issue. Thanks. 

Share this post


Link to post
Share on other sites
  • 0

Posted · Report post

I have reported the issue regarding multiple parallax canvas areas not working. However, you can't really have a parallax effect work correctly in the Footer area, as you need to scroll for the effect to work. If you can't scroll it won't work either that or you will need to have a lot of content in your footer area for the effect to take place.

Share this post


Link to post
Share on other sites
  • 0

Posted · Report post

Thanks Danny.

 

Yes - I know that the the Parallax does not work effectively in the footer -- but it works better than in the content area (which it doesn't work at all in). The meeting was successful, but now the canvas areas have been moved back to the canvas area - and do not work as they should. I had to move them out of the footer because I do not want those sections to be visible on any other pages. Hopefully this can get resolved quickly because that feature is one that my client was extremely excited about. 

 

From what I was able to troubleshoot - it doesn't matter if there are multiple parallax canvas areas. It still doesn't work if there is only 1 parallax canvas area that is inserted into the content area of the template. Hopefully this helps, so you can update your report to the tracker. 

 

Thanks so much for reporting this to your tracker. Let me know if I can be of any additional help to get this issue resolved. Is there any way I can be notified when this is resolved? 

Share this post


Link to post
Share on other sites
  • 0

Posted · Report post

jmad that little piece of code for the fixed background was a life saver for me! Exactly what I was looking for! Solves it for me. This site is still in the beginning stages, but I think it is going to sweet! http://www.tsreclaimedlumber.com/

 

Thanks for sharing that code. 

Share this post


Link to post
Share on other sites
  • 0

Posted · Report post

davemoppert

 

Can you please disable all plugins and remove all custom code you may have added and see if this resolves your issue please. As our developers have viewed the bug report I made and they can not reproduce the issue. They added multiple canvas areas and they all worked.

Share this post


Link to post
Share on other sites
  • 0

Posted · Report post

Thanks Danny, but I already troubleshooted using these techniques before posting the problem - regardless, I decided to create a fresh wordpress and pagelines install and try to re-create the page testing for the Parallax issue as I added more content. This is what I found: 

 

The page template has a RevSlider as the first section on the page template and the settings were set to 'Set to full window height'. That was causing the issue with the parallax backgrounds not working -- or so I thought. When I deactivate the 'Set to full window height' setting in the Rev Slider, the first canvas area after that sort of parallaxed about halfway up the page and then stopped. The remaining canvas areas were static. 

 

Then, I decided to just move the RevSlider down past the canvas areas I want to parallax... after doing this, I noticed the first three canvas areas parallaxed until I scroll to about halfway through the second canvas area -- then it goes static (even though I know there is more to the image) the remainder of the canvas areas stayed static. 

 

It seems like all of the canvas areas are referencing one set height to scroll or something. It's weird... Does the parallax function reference the canvas area height that it's been assigned to OR (what I'm starting to suspect) the content area height to perform it's function? 

Share this post


Link to post
Share on other sites
  • 0

Posted · Report post

It's almost like the parallax works but only until you scroll past the the point that displays initially (the fold). 

Share this post


Link to post
Share on other sites
  • 0

Posted · Report post

Danny or anyone other staff with Pagelines -- still haven't heard back about this issue. What's the story?

Share this post


Link to post
Share on other sites
  • 0

Posted · Report post

davemoppert - Can you create a page with only canvas sections using images and the parallax effect, so our developers can take look please. As, none of them are able to recreate the issue. When they add multiple canvas sections using the parallax effect, the effect works on all areas as intended.

Share this post


Link to post
Share on other sites

Create an account or sign in to comment

You need to be a member in order to leave a comment

Create an account

Sign up for a new account in our community. It's easy!


Register a new account

Sign in

Already have an account? Sign in here.


Sign In Now