Fixed revolution slider

Hello!

How can I fix the position of the revolution slider?

The css code does not work, the betheme setting always overwrites it.

own css code:

rs-slide {

  position: fixed;

display: block;

  overflow: hidden;

  height: 100%;

  width: 100%;

  z-index: 20;

  opacity: 1;

  visibility: inherit;

}

when the page loads:

rs-slide {

  position: absolute;

  display: block;

  overflow: hidden;

  height: 100%;

  width: 100%;

  z-index: 20;

  opacity: 1;

  visibility: inherit;

}


Thanks, György

Comments

  • Hi,

    Please always attach a link to your website so we can check it out. If the page is offline(localhost), then our help will be limited. You will have to contact us when the page is online. Also, please make sure that the page is not under maintenance before you provide us with the link.

    Can you also explain how it should work, please?

    Should the whole slider be fixed or one of its layers?

    Thanks

  • edited September 2022

    Hello!


    My website url: www.helpee.hu

    I want to fixed the whole slider as here: https://themes.muffingroup.com/be/firm/ (although this is an image here, not a revolution slider)

    Thanks.

  • Please, do not share your login credentials on the forum, as others can see it. If I will need them I will ask you to send them through a private message.

    The demo you mentioned does not use Slider Revolution.

    To achieve that, please, go to Betheme -> Theme options -> Global -> General set the Image background, choose the position to be fixed and choose Content transparency.

    Best regards

  • Thanks for the reply.

    I know that the demo sent does not use the revolution slider, I wanted to show the fixed background.

    What I would need is for the current revolution slider to stay fixed in place and for the next block to slide onto it.

    If I fix the location of the slider in the css, some setting overrides this:

    own css code: 

    rs-slide {

    position: fixed;

    display: block;

      overflow: hidden;

      height: 100%;

      width: 100%;

      z-index: 20;

      opacity: 1;

      visibility: inherit;

    }

  • Please, try to add !important property to the position attribute.

    You can also try using the .mfn-rev-slider class instead.

    .mfn-rev-slider{
    position: fixed!important;
    }
    

    Best regards

Sign In or Register to comment.