This thread is over two years old and may be outdated. Please create a new thread if you need help, or email us if you have an active Premium license.

Background gradient of a row using Pagebuilder keeps parallaxing

Resolved 7 replies pluginplugin-page-builderquestion
yadihinz
8 years ago · Last reply by yadihinz 8 years ago

Hi I wanted to set a fixed background gradient on a row of a widget but it keeps parallaxing the gradient.
How can I set it fixed ?
There’s no setting on edit row only in the widget itself there’s an option but it fixes only the widget part not the total row.

This is our free support forum. Replies can take several days.

Need fast email support? Get SiteOrigin Premium

Replies

7
  1. Alex S Staff 8 years, 7 months ago

    Hi Yadihinz,

    Do you have a public URL where we can take a look at what’s going on?

    To clarify, what is your Background Image Display Set as? Fixed or Parallax?

  2. yadihinz 8 years, 7 months ago

    Hi Alex,

    I don’t see that option in the Row settings.
    I can only see that setting on cell setting and that one is set to fixed.
    Also if I add a widget on the row and use the same css for gradient it’s working on the background of the widget without any problem.

    Only the total row stays in parallax mode.

    http://www.vanal.be/nl/uw-partner-horeca-bedrijfskeukens-en-grootkeukens/

  3. Alex S Staff 8 years, 7 months ago

    Hi Yadihinz,

    That’s odd. What do you see in the Row Styles Design settings group instead?

    > Also if I add a widget on the row and use the same css for gradient it’s working on the background of the widget without any problem.

    I mean, you should be able too but until I know what you’re seeing instead I can’t be certain. It’s worth trying regardless though – the worse that come happen is that it doesn’t work and if it doesn’t work, you can just remove it.

  4. yadihinz 8 years, 7 months ago

    edit row
    setting
    layout setting

    What a mess I made :)

  5. yadihinz 8 years, 7 months ago

    CSS that I use for gradient

    background: -moz-linear-gradient(top, rgba(63,63,63,1) 0%, rgba(91,91,91,1) 0%, rgba(63,63,63,1) 100%); /* FF3.6-15 */
background: -webkit-linear-gradient(top, rgba(63,63,63,1) 0%,rgba(91,91,91,1) 0%,rgba(63,63,63,1) 100%); /* Chrome10-25,Safari5.1-6 */
background: linear-gradient(to bottom, rgba(63,63,63,1) 0%,rgba(91,91,91,1) 0%,rgba(63,63,63,1) 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#3f3f3f', endColorstr='#3f3f3f',GradientType=0 ); /* IE6-9 */
  6. Alex S Staff 8 years, 7 months ago

    Hi Yadihinz,

    Please add the following additional styling to your CSS:

    background-position: top center !important;
	background-attachment: scroll !important;

    That’ll prevent the parallax from occurring. There doesn’t appear to be a setting to disable the Sydney parallax which is why CSS is required. Please note that the Background Image Display settings aren’t present due to Sydney row stylings.

  7. yadihinz 8 years, 7 months ago

    That’s it awesome. Thanks a lot Alex !

Replies on this thread are closed.

Please create a new thread if you have a question, or purchase a SiteOrigin Premium license if you need one-on-one email support.

Have a different question or issue?

Start New Thread