Questions tagged [owl-carousel]

Owl Carousel is a touch-enabled jQuery plugin that lets you create a beautiful responsive carousel slider.

Version 2

Version 1

1693 questions
8
votes
3 answers

Owl Carousel Outer Arrow Navigation

I'm trying to implement the Owl Carousel with Lazyload images for a portfolio site and am having issues with positioning my navigation buttons. Ideally i'd like to add these on the outside of the carousel positioned halfway up the image. I have seen…
Euan Mackay
  • 93
  • 1
  • 1
  • 8
8
votes
4 answers

Owl Carousel Transitions Effect Not Working After Chrome Latest Update (V36)

i'm using the OWl carousel for a while everything were perfect but recently i faced a issue after my chrome browser update. The css transition effects are not working anymore on chrome. But all effects working fine on firefox. Anyone can help me..
Karthikraja
  • 366
  • 1
  • 4
  • 12
7
votes
0 answers

Owl Carousel - auto scroll and setting it up to have 2 cards

I am trying to configure auto scroll to be activated on button click events - but also to have only 1 card per slide. Below is the current sample I've got working in the jsfiddle. How would I go about configuring the slider to take 2 cards, but be…
The Old County
  • 89
  • 13
  • 59
  • 129
7
votes
2 answers

Owl Carousel Error: Sliding Entire Page On Mobile Safari - iPhone

So I'm currently working on http://coin.codeclimb.com and for some reason the owl carousel slider on the homepage is not working on iPhone safari. When I slide on iPhone it is swiping ALL the content on the whole page and breaking things. I can not…
7
votes
2 answers

Adjust height of owl-carousel

Currently the owl-carousel that I have employed in my website is far too tall, as it takes up more than the full screen. From the demo on owl-carousel for one image per slide it appears that it is possible to adjust the height. I am using the latest…
BSpassky
  • 71
  • 1
  • 1
  • 2
7
votes
1 answer

The active item should be in the middle of Owl Carousel

I have a problem with my owl-carousel. Everything works fine but the active item is the first one on the page not the middle one (the colored is the active one). You can see this in the following screenshot. I would like to have the middle item…
Gabbax0r
  • 1,696
  • 3
  • 18
  • 31
7
votes
1 answer

Owl carousel all items visible when page is loading

This problem occurs mainly when user is using a little bit slower internet or mobile for example. But flashing is sometimes also seen on higher speeds when page content / images in carousel hasn't been cached. If page loads and first elements are…
Solo
  • 6,687
  • 7
  • 35
  • 67
7
votes
7 answers

How not to stop owl carousel on hover?

Currently the carousel stops when you hover it, I've added autoplayHoverPause:false but it doesn't seem to change anything. Is there another option that I could use to stop it from stopping when it's hovered? $('.owl-carousel').owlCarousel({ …
Dana
  • 123
  • 1
  • 1
  • 8
7
votes
5 answers

Owl Carousel - width is calculated wrong

I have three responsive items (imgs), but every time the Owl-Carousel is loaded, the owl-wrapper width is two times the size of all images together. For example; if the images fullsize takes 1583 px, the owl-wrapper takes 1583 * 3 * 2 = 9498px, and…
Vinicius Ottoni
  • 4,631
  • 9
  • 42
  • 64
7
votes
2 answers

Owl-carousel and lightbox together? Or is there another solution?

I would like to use Owl-carousel and PrettyPhoto lightbox together but before that, I would like to know if a similar all-in-one solution already exists. To be more specific, I would like to make an inline image/video content slider gallery with…
dragoweb
  • 699
  • 1
  • 8
  • 17
7
votes
2 answers

Adding animated captions to Owl carousel

I'm using Owl Carousel and have been trying to add animated captions (just a simple fadein on slide display) but can't seem to figure out how to do it. I have the opacity of all the captions set to 0 and then add a class named "animate-me" (with…
user736129
  • 119
  • 1
  • 2
  • 9
7
votes
7 answers

Owl carousel still transitions when only 1 slide in carousel

I wonder if anyone could help with this. I am using carousel in a CMS and would like the ability for the customer to sometimes only have 1 slide if they so wish. However if only 1 slide is there the fade transition still occurs so it basically…
user3001694
  • 71
  • 1
  • 1
  • 2
6
votes
1 answer

Owl Carousel Prevent Click on Drag

I'm using the ngx-owl-carousel-o library in Angular. Each carousel item is created as a div with a (click) event. The problem I had is that when dragging the carousel it would always trigger the click event undesirably i.e click should only trigger…
Jnr
  • 1,504
  • 2
  • 21
  • 36
6
votes
4 answers

How can I set all Owl Carousel items to equal height?

I am working on owl carousel I want all items with the same height when there is more content added items height are not coming equal. I tried with flex properties also but am not understanding why it is not working. please, anyone, point me in the…
Asiya Fatima
  • 1,388
  • 1
  • 10
  • 20
6
votes
3 answers

Full Width - Owl Carousel 2 issue

Attempting to create a full-width owl-carousel but I keep seeing this on .owl-stage when I inspect-element on chrome: element.style { transform: translate3d(-1872px, 0px, 0px); transition: 0s; width: 7264px; padding-left: 200px; …
Etep
  • 2,721
  • 4
  • 17
  • 28