Implementing parallex for mobile devices

[poojanadkarni1]

Hi,

I have my page http://seerion-2310098.hs-sites.com/staging/-0 and for my banner image, I have written code for making it parallex . It works fine for desktop but I guess something wrong with my media query. 

Below is my code: can someone help me render it well on mobile too? 

.parallax-section-1{
background-size:cover;
background-position:center center;
background-attachment:fixed;
background-repeat:no-repeat;
background-image: url('https://cdn2.hubspot.net/hubfs/2310098/bigstock-Business-Man-In-Blue-Grey-Suit-76633433-min-1.jpg');
height:500px;
}

@media screen and (max-width: 768px){

.parallax-section-1{
height:200px;
background-position:center 170px;
background-repeat:no-repeat;
background-size:contain;

background-image: url('https://cdn2.hubspot.net/hubfs/2310098/bigstock-Business-Man-In-Blue-Grey-Suit(for%20mbile).png');

}

[edjusten]

Hi @poojanadkarni1 Apologies that no one has reached out to you yet. 

Can you let me know if this is still an issue for you? Your backgrounds are set to cover (desktop) and contain (mobile) which is cancelling out the parallex effect. It also appears the correct js is not being pulled in. 

Please let me know and I can troubelshoot further. 

Ed 

INBOUND 2017 is just around the corner. Find out more at inbound.com or check out the post on the main Community page and check out the upcoming AMA with Deb Calvert.