Owl carousel fix for chrome. Owl Slider is great and it’s one of my go to jQuery plugins when it comes to building slideshows, however Chrome is a cheapskate (for good reasons) when it comes to using the GPU for animations. This can cause CSS transitions to lag, if you are experiencing this the following fix should work for you.

Owl carousel fix for chrome.

.owl-carousel .owl-wrapper-outer{
   overflow: hidden;
   position: relative;
   width: 100%;
   z-index: 1;  /* added this */
.owl-item { 
  transform: translateZ(0);
 -webkit-transform: translateZ(0); 
 -ms-transform: translateZ(0); 

With the CSS code above we trick Chrome into thinking we are going to use 3D transformations on the owl carousel elements, this way we explicitly tell Chrome to use GPU acceleration for these items when they are being rendered.
This should make animations much smoother.

Check out Owl Carousel.

If you are interested in learning more about GPU acceleration read my post
Improving HTML5 app performance with GPU accelerated CSS transitions
on the Urban Insight Blog.

Please like the page if you found it useful. ♥