Removing Parallax on header slider

[sellington79669]

Hi Swift

Great theme!

I wonder if you can help, my client doesn’t want the swift slider header on the home page to ‘parallax’ as you scroll down. He would like to preserve the rounded bottom edge of the image. Is there an option to do this? I can’t seem to get this to work.

Many thanks
Simon

[email protected]

[David Martin – Support]

Looks like you have already added the CSS to round the image?

– David.

[sellington79669]

Hi David

No I haven’t added any css I just added an image with a rounded edge already in place on the image. Is there a css route to achieve the same effect without it disappearing as you scroll. Notice on the attached the image looks fine when it first loads but then as you scroll the curved base disappears in a parallax effect.

If it is possible to achieve this with css and the curved bottom remain that is what I am trying to achieve. Maybe you can advise how I can achieve this.

Many thanks
Simon

Attachments:

You must be logged in to view attached files.

[David Martin – Support]

Hi,

Yes this possible.

Try adding this custom CSS to Theme Options => Custom CSS:

.swiper-slide.swiper-slide-active {
    z-index: 1;
    -webkit-border-bottom-right-radius: 50px;
    -webkit-border-bottom-left-radius: 50px;
    -moz-border-radius-bottomright: 50px;
    -moz-border-radius-bottomleft: 50px;
    border-bottom-right-radius: 50px;
    border-bottom-left-radius: 50px;
    background-color: transparent!important;
}

The greater the px value, the larger the border radius.

Thanks.

[sellington79669]

Thanks for this David and I have managed to get rounded corners coming in using the css now which is great so thank you for your help with this. However the image still cuts off as you scroll as part of the parallax and what the client really wants here is the curved bottom edge of the image to remain and not disappear ‘under’ the section below it as you scroll. In other themes there is an option to turn this parallax style on or off so I was hoping this could be achieved with Uplift?

Many thanks
Simon

[David Martin – Support]

Please also add this:

.swift-slider.swift-slider-parallax {
    position: absolute!important;
}
.swiper-slide .caption-wrap, .swift-slider.swift-slider-parallax {
    translate(0px)!important;
}

Thanks.