for z-index to work

you need a position that isn’t static (the default)

 

ex:

 

position: relative;

z-index: 100;

Advertisements
for z-index to work

so. you need to make the owl carousel fade in and out instead of swiping.

THIS IS NOT BUILT IN TO A STANDARD OWL-CAROUSEL FEATURE.

Find the animation you want in the animate.css library. Choose the in and out versions of the animation you want.

Add a property name to your slider describing the transition.

transitionStyle :"Fade",
Rename your animation in this style:
owl-Fade-in, owl-Fade-out

Big thanks to:

http://www.landmarkmlp.com/js-plugin/owl.carousel/demos/transitions.html

 

so. you need to make the owl carousel fade in and out instead of swiping.