Disable Parallax Background?

…it’s disabled on my iPhone and iPad, but not on my laptop. I’m trying to figure out why..?

:/

Hi, can you post the URL of your site? I need to check it directly to get the section ID in your site.

Hi awanrmb,

Of course, it’s: https://www.pivotwright.com/

Thanks!

Hi,

I’ve checked your site but where did you put the background? Btw, have you try to manage it from “Edit widget” https://prntscr.com/9yw3bw

Hi awanrmb,

I’m sorry, I had actually taken it down. I’ll add a couple of examples to see if you can maybe help me with some suggestions. If you only know how to solve one of the two, then that’s more than good enough.

Also, I tried selecting the “Cover” option on the Services Type A widget, but unfortunately it still didn’t work.

Thank you for all of your help. I really appreciate it!

-Roanel

hmm please try this css code below:

.panel-row-style {
  background-position: center top !important;
}

you can put the css code in child theme or use simple custom css plugin

Unfortunately, it didn’t work.

I noticed that in the theme’s stylesheet there were several css code’s for parallax functions (towards the bottom) For example, I saw:

(1)
@media only screen and (min-width: 1930px) {
.parallax {
background-size: cover;
}
}

(2)
/* Smaller than standard 980 */
@media only screen and (max-width: 991px) {
.site-header.fixed {
position: static !important;
}
.parallax {
background-size: cover;
background-attachment: scroll;
background-position: top center!important;
}

———
So I tried adding the following css codes in the child theme, but still no cigar. ??

I tried:

(1)
@media only screen and (max-width: 1281px) {
.parallax {
background-size: cover;
background-attachment: scroll;
background-position: top center!important;
}
}

(2)
@media only screen and (max-width: 1367px) {
.parallax {
background-size: cover;
background-attachment: scroll;
background-position: top center!important;
}
}
——-

It’s driving me crazy! Lol! ??

its not using .parallax, the background of those row is using .panel-row-style and my css code in above should worked in all devices.

where did you put my css code in above?

Hi awanrmb,

I put it into my child theme (style.css).

Is this where it’s supposed to be?

I’ve also tried putting it into “Appearance -> Custom CSS”, but that also hasn’t worked. I even tried putting it into my Theme Functions (functions.php) folder. I ended up crashing my site like a dummy. ?? Luckily, I learned that I could go into my control panel and replace the corrupted child theme function.php file by going into my wp-content=>themes folder.

OMG! I got, awanrmb!! ??

So I went to (1) “Edit Page”, (2) selected the wrench for the row “Edit Row”, (3) clicked on “Theme”, (4) added “disable-parallax” to the Row Class, (5) then added the following css code to my child theme

.disable-parallax{
background-position: 50% 50% !important;
background-attachment: scroll !important;
}

—————
I can’t believe I finally got it. This thing has been driving me crazy. ?? I still really appreciate your help with this, however.

Thanks!

*I got it

Great! I never thought that the issue can by resolved using that trick.

Btw, thank you for share the solution in here

Of course, it’s always important to pay it forward.

Thanks again

.