Slider to show a bit of the next slide in sequence

Hi, I’ve been fiddling around for a while and can’t seem to get the desired effect…

I have a slider element with a few slides in it. I would like to show about 10% (or a pixel value) of the next slide in the sequence. It’s a nice UI effect that’s quite trendy at the moment.

So having the current slide displaying with a little bit of the next one to incentivise the user to scroll through.

Is this possible? Would really appreciate your help :slight_smile:


Hello David,

Thanks for writing in! Regretfully what you may have wanted may not be possible. Please refer to the Slider Revolution plugin documentation instead:

Or you can check out the video tutorials:

Best Regards.

Thanks for the suggestion @ruenel, I’m a bit surprised this is not possible currently. I try to avoid revslider at all costs but I may be able to get away with using The Grid for a similar result.


You’re most welcome David.


Just FYI I was able to achieve this affect with the Classic Slider through CSS by setting .x-flexslider and .flex-viewport to overflow: visible
Then adding blocks with ::before and ::after classes to the row where the slider was embedded and set the z-index higher than the slider so it blocked the slides from showing on the left and right.

Hi David,

The classic slider is a pretty basic slider. You will have to add custom CSS codes to modify the classic slider to do what you have in mind. It is best that you use The Grid plugin and displays the grid items in a carousel manner. Check out some of the examples here:

Hope this helps.

Hi Reunel, There is no need as I was able to achieve the solution I desired as described above.

Hey David,

We are just glad that you have figured it out a way to correct the said issue.
Thanks for letting us know!

Best Regards.