Parallax Effect for Background Images (Banner / Jumbotron)


#1

I am sure this is not possible yet, but are there plans to add a parallax effect to the banner and jumbotron stacks when using an image as background?

It would be awesome to have the choice between “locked”, “parallax” and regular scrolling.


#2

I don’t currently have plans for adding Parallax to the Banner or Jumbotron stack. I will think about it, and add it to a “wish list” though.


#3

Thanks, Adam . In the meantime Joe Workman has a parallax stack. Maybe it works with Foundry.


#4

I just tested Joe Workman’s Parallax stack with Foundry and there is a conflict.

While the plugin works, it does kill the sticky navigation bar. The moment the Parallax stack is on a page, the navigation bar is no longer sticky, it just disappears. When I try to scroll past the end of a page - then it appears for a second, but as soon as I let go of the page, the nav bar is gone again.


#5

I figured it out. I had the Nav. Bar stack on my page on the top layer while everything else is in container and margin stacks. When I put the Parallax stack on my page (also on the top layer and not inside any stack), Parallex and the Nav. Bar stack collide and the sticky nav bar is gone.

Solution: I wrap Parallax in a margins stack (margins/padding all left at 0) and the conflict is gone. The nav bar now sticks to the top of the page, on top of the parallax full-width background image. I guess the margins stack acts as a protective shell.