New Mobile-friendly Landing Page Parallax Hero Banner

[BootstrapC]

The Parallax Hero Banner module is very popular in the marketplace but I noticed it had a few  negative reviews mentioning how it wasn't performing well on mobile. Below is an example.

"We liked it initially, but after using it a bit we found that the image didn't render on phones well (not the phone view in edit mode), also it left space vertically; sadly we took it off." - Bob Burk

So I decided to address these issues and create my own module to make it work better on mobile devices by using two images instead of one. One square image for mobile and one rectangle image for larger width screends. This gives the author some "art-direction" control on how the banner looks on different devices.
View a demo.

If you have used the HubSpot version in the past I would suggest you check out my new module in the marketplace.

Would also appreciate any feedback you might have.

---

Jacob Lett

Freelance HubSpot CMS Developer & Web Designer

---

Located in Michigan, USA

Get a free estimate now ›

[vjuncoec]

Thank you for the guide. I followed instruction but I keep having trouble with responsive. Perhaps, should I change the size of the pictures?

I am using the same for both platform: pc and mobile.

[natsumimori]

Thanks for sharing @BootstrapC !

You guys might be interested in this: @karstenkoehler , @Josh , @Mike_Eastwood , @Anton