Questions tagged [owl-carousel-2]

Used for all questions relating to the Owl Carousel touch-enabled jQuery plugin version 2.

Owl Carousel is a touch enabled jQuery plugin that allows you to easily build carousel that are supported on a variety of platforms and devices.

Features

  • Drag and drop support on mobile and in browsers.
  • Responsive
  • Automatic fallback to when is not supported
  • Support for modules and plugins

Resources

Related Tags

342 questions
2
votes
0 answers

OwlCarousel2 pause embedded video after slide change

I have an Owl Carousel 2 with Vimeo and YouTube embed in some slides. I am trying to pause the video after slide change, but without success. After some search, I've found that to pause an YouTube video I need to use API... I'm thinking in save the…
thiagoili
  • 41
  • 1
2
votes
0 answers

Infinite loop and number of slides on mobile not working with Owl Carousel

I've created a slider using Owl Slider v2.2.1. I have two issues. I need it to have a infinite loop, i'm setting loop:true but it doesn't seem to work. I need there to be a minimum of two slides. I've set this to 2 but it only shows two down to…
user3486427
  • 434
  • 9
  • 18
2
votes
1 answer

Owl Carousel with conditionals on its options

I've got a dozen galleries and some of them only has one image. This is causing the carousel and page to break because the carousel has loop = true set on it. I'm trying to write a condition to say if there's more than one item in the carousel, to…
Darren Bachan
  • 735
  • 2
  • 11
  • 30
2
votes
2 answers

Using owl-filter.js to filter through owl carousel items

I am using this plugin to filter through items in my owl carousel But it is not working, I have had various console errors, this is the current one: "Uncaught ReferenceError: initOwlEvent is not defined" I have added the jquery.owl-filter.js in the…
user2953989
  • 2,791
  • 10
  • 36
  • 49
2
votes
1 answer

start items owlcarousel2 slider with custom class

i use owlcarousel2 slider and i want slide item displayed that custom class jQuery(document).ready(function($){ $(".owl-carousel").owlCarousel({ items: '7', rtl: true, }); });
aqrcode
  • 21
  • 1
  • 3
2
votes
2 answers

How to run autoplay video and mute the sound?

How to run autoplay video and mute the sound for owl carousel 2? My code - https://jsfiddle.net/ufqp8Lku/ $('.owl-carousel').owlCarousel({ items: 1, merge: true, loop: true, margin: 10, video: true, lazyLoad: true, center:…
Dmitriy
  • 4,475
  • 3
  • 29
  • 37
2
votes
1 answer

How do I specify number of items to be shown in Owl carousel 2?

In Owl carousel 1 I could specify different number of items to be shown depending on the viewport width: items:5, itemsDesktop:[1199,4], itemsDesktopSmall:[979,3], itemsTablet:[768,2], itemsMobile:[479,1] However, the code above doesn't work with…
sdvnksv
  • 9,350
  • 18
  • 56
  • 108
2
votes
1 answer

How to make Owl Carousel keyboard accessible

According to the Web Content Accessibility Guidelines, in order for a website to be considered accessible, you should be able to use a keyboard for all functionality of the content: All functionality of the content is operable through a keyboard …
Eran Shabi
  • 14,201
  • 7
  • 30
  • 51
2
votes
1 answer

Owl carousel Jump to a particular Item with no scroll

I have a owl carousel setup. Where I am trying to jump to particular items. Here is a fiddle. FIDDLE I am using owl.goTo to directly jump to an item. $('.goTo').click(function() { carousel.trigger('owl.goTo', owl.currentItem + 5) }); But…
Mark Wilson
  • 1,324
  • 2
  • 10
  • 19
2
votes
2 answers

Does Owl Carousel Really Work without a fixed width?

I have been using owl carousel 1.3 on pages that generally have a wrapper container that sets the width to 1200px. I started to build responsive sites and don't use a fixed width on any wrappers now, i am also using version 2 of Owl. I am using the…
novak73
  • 15
  • 2
  • 6
2
votes
1 answer

Why owl-carousel change items width automatically when the window resized?

I have a problem with owl-carousel 2. Following is my js code : $(".top_slider").owlCarousel({ items:1, navigation: true, navigationText: ['', '
Harun Acar
  • 33
  • 6
2
votes
0 answers

Owl Carousel center two items

I'm trying to use Owl carousel 2 to create a slider which centers two items instead of the option which centers one. So far I've managed to add an extra class to the item left of the centered item by adding some lines to the source code. if…
2
votes
3 answers

How to disable swipe effect in owl carousel 2?

I need to disable swipe effect on owl carousel 2 and add only fadeIn effect. How is it possible ? I have tried this code but no luck at all. animateOut: 'fadeIn', animateIn: 'fadeout', nav:true, Thanks
sunilkjt
  • 985
  • 4
  • 12
  • 21
2
votes
1 answer

How to replace OWL Carousel image with embed code on click event

I am using OWL Carousel to display projects and now I want to replace this embed code to clicked image:
Mr.Happy
  • 2,639
  • 9
  • 40
  • 73
2
votes
1 answer

Form inside Owl Carousel version 1&2

I am building a simple form inside an Owl Carousel but I can't get it to work on their version 2. The problem is when the user click inside the input type on the second version the console log gives an error :Uncaught TypeError: Cannot read property…
ryangus
  • 679
  • 3
  • 8
  • 22