Docs

[auldreekie]

Hi, I’ve got a slider on a page of my site. The content of each slide is different lengths – this causes the page length to change, and the background image on the containing element to move up and down – can I fix this in a way that will work on a responsive site?

I’m also using prev / next navigation. I’d like this to appear to the left and right of each slide – but when I try to target each element and move them using relative / absolute positioning, both arrows disappear between slides then reappear when the next slide loads.

Any ideas?

Thanks

[auldreekie]

This reply has been marked as private.

[Rue Nel]

Hello There,

Thanks for writing in! To have the same slide height, please edit your page in Cornerstone and insert the following custom css in the settings tab, Settings > Custom CSS

.x-flexslider-shortcode-container .x-flexslider-shortcode {
    max-height: 599px;
    overflow: hidden;
}

And if you want something like this: http://prntscr.com/e9rx7m for the slide arrow controls, you can make use of this code by inserting this in the settings tab, Settings > Custom CSS

.flex-direction-nav a.flex-prev,
.flex-direction-nav a.flex-next {
    top: 50%
}

.flex-direction-nav a.flex-next {
    left: auto;
    right: 14px;
}

We would loved to know if this has work for you. Thank you.

[auldreekie]

Thanks, this worked beautifully!

[Lely]

You’re always welcome!

Cheers!

[Author]

Posts