INTEGRATED ANIMATED EFFECTS

INTEGRATED ANIMATED EFFECTS

76 Animation Effects

See Full List of Features
GOOGLE FONTS

GOOGLE FONTS

Embed fonts easily

Read Customer Reviews
Fully Responsive Slider & Carousel

Fully Responsive Slider & Carousel

It's 100% responsive

Buy It Here
Slider Generator

Slider Generator

Comes with dashboard carousel generator

Watch How It Warks

Concrete5 OWL Carousel

Whale OWL Carousel is a touch enabled jQuery plugin that lets you create beautiful responsive carousel slider with tons of options and dashboard carousel generator.

This Add-on based on "OWL Carousel" 


Features and Options:

  • Responsive
  • 76 animation effects [NEW]
  • Capability to set number of items for different devices
  • Fullscreen Slider
  • Google fonts embed [NEW]
  • Lightbox (touch enabled)
  • Carousel generator at Dashboard
  • Add Header/Description/Link (External, Internal) for every slide
  • Image Size: Width And Height
  • Carousel Bg Color
  • items: This variable allows you to set the maximum amount of items displayed at a time with the widest browser width
  • Items Desktop: This allows you to preset the number of slides visible with a particular browser width. The format is [x,y] whereby x=browser width and y=number of slides displayed. For example [1199,4] means that if(window
  • itemsDesktopSmall: As above.
  • itemsTablet: As above.
  • itemsTabletSmall: As above. Default value is disabled.
  • itemsMobile: As above
  • singleItem: Display only one item. See demo
  • itemsScaleUp: Option to not stretch items when it is less than the supplied items. See demo
  • slideSpeed: Slide speed in milliseconds
  • paginationSpeed: Pagination speed in milliseconds
  • rewindSpeed: Rewind speed in milliseconds
  • autoPlay: Change to any integrer for example autoPlay : 5000 to play every 5 seconds. If you set autoPlay: true default speed will be 5 seconds.
  • stopOnHover: Stop autoplay on mouse hover
  • navigation: Display "next" and "prev" buttons.
  • navigationText: You can cusomize your own text for navigation.
  • rewindNav: Slide to first item. Use rewindSpeed to change animation speed.
  • scrollPerPage: Scroll per page not per item. This affect next/prev buttons and mouse/touch dragging.
  • pagination: Show pagination.
  • paginationNumbers: Show numbers inside pagination buttons
  • responsive: You can use Owl Carousel on desktop-only websites too! Just change that to "false" to disable resposive capabilities
  • responsiveRefreshRate: Check window width changes every 200ms for responsive actions
  • lazyLoad: Delays loading of images. Images outside of viewport won't be loaded before user scrolls to them. Great for mobile devices to speed up page loadings. IMG need special markup class="lazyOwl" and data-src="your img path".
  • lazyFollow: When pagination used, it skips loading the images from pages that got skipped. It only loads the images that get displayed in viewport. If set to false, all images get loaded when pagination used. It is a sub setting of the lazy load function.
  • lazyEffect: Default is fadeIn on 400ms speed. Use false to remove that effect.
  • autoHeight: Add height to owl-wrapper-outer so you can use diffrent heights on slides. Use it only for one item per page setting.
  • dragBeforeAnimFinish: Ignore whether a transition is done or not (only dragging).
  • mouseDrag: Turn off/on mouse events.
  • touchDrag: Turn off/on touch events.
  • addClassActive: Add "active" classes on visible items. Works with any numbers of items on screen.
  • transitionStyle: Add CSS3 transition style. Works only with one item on screen.
  • language file included