PHPackages oneistbesser/owl-carousel - PHPackages - PHPackages [Skip to content](#main-content)[PHPackages](/)[Directory](/)[Categories](/categories)[Trending](/trending)[Leaderboard](/leaderboard)[Changelog](/changelog)[Analyze](/analyze)[Collections](/collections)[Log in](/login)[Sign up](/register) 1. [Directory](/) 2. / 3. oneistbesser/owl-carousel ActiveLibrary oneistbesser/owl-carousel ========================= Touch enabled jQuery plugin that lets you create beautiful responsive carousel slider. 11.4kJavaScript Since Nov 11Pushed 5y ago1 watchersCompare [ Source](https://github.com/1istbesser/owl-carousel)[ Packagist](https://packagist.org/packages/oneistbesser/owl-carousel)[ RSS](/packages/oneistbesser-owl-carousel/feed)WikiDiscussions master Synced today READMEChangelogDependenciesVersions (1)Used By (0) YEAH SO THIS IS PRETTY MUCH DEAD, DO YOURSELF A FAVOR AND SWITCH TO [tiny-slider](https://github.com/ganlanyuan/tiny-slider) ============================================================================================================================ [](#yeah-so-this-is-pretty-much-dead-do-yourself-a-favor-and-switch-to-tiny-slider) --- --- --- Owl Carousel 2 ============== [](#owl-carousel-2) Touch enabled [jQuery](https://jquery.com/) plugin that lets you create a beautiful, responsive carousel slider. **To get started, check out .** **Notice:** The old Owl Carousel site (owlgraphic \[dot\] com) is no longer in use. Please delete all references to this in bookmarks and your own products' documentation as it's being used for malicious purposes. Quick start ----------- [](#quick-start) ### Install [](#install) This package can be installed with: - [npm](https://www.npmjs.com/package/owl.carousel): `npm install --save owl.carousel` or `yarn add owl.carousel jquery` - [bower](http://bower.io/search/?q=owl.carousel): `bower install --save owl.carousel` Or download the [latest release](https://github.com/OwlCarousel2/OwlCarousel2/releases). ### Load [](#load) #### Webpack [](#webpack) Add jQuery via the "webpack.ProvidePlugin" to your webpack configuration: ``` const webpack = require('webpack'); //... plugins: [ new webpack.ProvidePlugin({ $: 'jquery', jQuery: 'jquery', 'window.jQuery': 'jquery' }), ], //... ``` Load the required stylesheet and JS: ``` import 'owl.carousel/dist/assets/owl.carousel.css'; import 'owl.carousel'; ``` #### Static HTML [](#static-html) Put the required stylesheet at the [top](https://developer.yahoo.com/performance/rules.html#css_top) of your markup: ``` ``` ``` ``` **NOTE:** If you want to use the default navigation styles, you will also need to include `owl.theme.default.css`. Put the script at the [bottom](https://developer.yahoo.com/performance/rules.html#js_bottom) of your markup right after jQuery: ``` ``` ``` ``` ### Usage [](#usage) Wrap your items (`div`, `a`, `img`, `span`, `li` etc.) with a container element (`div`, `ul` etc.). Only the class `owl-carousel` is mandatory to apply proper styles: ``` Your Content Your Content Your Content Your Content Your Content Your Content Your Content ``` **NOTE:** The `owl-theme` class is optional, but without it, you will need to style navigation features on your own. Call the [plugin](https://learn.jquery.com/plugins/) function and your carousel is ready. ``` $(document).ready(function(){ $('.owl-carousel').owlCarousel(); }); ``` Documentation ------------- [](#documentation) The documentation, included in this repo in the root directory, is built with [Assemble](http://assemble.io/) and publicly available at . The documentation may also be run locally. Building -------- [](#building) This package comes with [Grunt](http://gruntjs.com/) and [Bower](http://bower.io/). The following tasks are available: - `default` compiles the CSS and JS into `/dist` and builds the doc. - `dist` compiles the CSS and JS into `/dist` only. - `watch` watches source files and builds them automatically whenever you save. - `test` runs [JSHint](http://www.jshint.com/) and [QUnit](http://qunitjs.com/) tests headlessly in [PhantomJS](http://phantomjs.org/). To define which plugins are build into the distribution just edit `/_config.json` to fit your needs. Contributing ------------ [](#contributing) Please read [CONTRIBUTING.md](CONTRIBUTING.md). Roadmap ------- [](#roadmap) Please make sure to check out our [Roadmap Discussion](https://github.com/OwlCarousel2/OwlCarousel2/issues/1756). License ------- [](#license) The code and the documentation are released under the [MIT License](LICENSE). ### Health Score 22 — LowBetter than 22% of packages Maintenance20 Infrequent updates — may be unmaintained Popularity16 Limited adoption so far Community20 Small or concentrated contributor base Maturity31 Early-stage or recently created project Bus Factor2 2 contributors hold 50%+ of commits How is this calculated?**Maintenance (25%)** — Last commit recency, latest release date, and issue-to-star ratio. Uses a 2-year decay window. **Popularity (30%)** — Total and monthly downloads, GitHub stars, and forks. Logarithmic scaling prevents top-heavy scores. **Community (15%)** — Contributors, dependents, forks, watchers, and maintainers. Measures real ecosystem engagement. **Maturity (30%)** — Project age, version count, PHP version support, and release stability. ### Community Maintainers ![](https://www.gravatar.com/avatar/98afea7042a8609f58d7a5642acdf4b09eff161d9a8c057716b52fc20a23185b?d=identicon)[oneistbesser](/maintainers/oneistbesser) --- Top Contributors [![hellobart](https://avatars.githubusercontent.com/u/32734780?v=4)](https://github.com/hellobart "hellobart (119 commits)")[![daviddeutsch](https://avatars.githubusercontent.com/u/630246?v=4)](https://github.com/daviddeutsch "daviddeutsch (62 commits)")[![greg5green](https://avatars.githubusercontent.com/u/1641918?v=4)](https://github.com/greg5green "greg5green (44 commits)")[![pascalporedda](https://avatars.githubusercontent.com/u/2995717?v=4)](https://github.com/pascalporedda "pascalporedda (32 commits)")[![OwlCarousel2](https://avatars.githubusercontent.com/u/18146764?v=4)](https://github.com/OwlCarousel2 "OwlCarousel2 (14 commits)")[![joeyjoejoejr](https://avatars.githubusercontent.com/u/1141502?v=4)](https://github.com/joeyjoejoejr "joeyjoejoejr (9 commits)")[![keeganbrown](https://avatars.githubusercontent.com/u/479440?v=4)](https://github.com/keeganbrown "keeganbrown (8 commits)")[![nervo](https://avatars.githubusercontent.com/u/95935?v=4)](https://github.com/nervo "nervo (8 commits)")[![tdecaluwe](https://avatars.githubusercontent.com/u/7951286?v=4)](https://github.com/tdecaluwe "tdecaluwe (6 commits)")[![peter-mouland](https://avatars.githubusercontent.com/u/1727939?v=4)](https://github.com/peter-mouland "peter-mouland (4 commits)")[![keefyhub](https://avatars.githubusercontent.com/u/8536452?v=4)](https://github.com/keefyhub "keefyhub (4 commits)")[![tomjn](https://avatars.githubusercontent.com/u/58855?v=4)](https://github.com/tomjn "tomjn (3 commits)")[![gabehayes](https://avatars.githubusercontent.com/u/105680?v=4)](https://github.com/gabehayes "gabehayes (3 commits)")[![prayagverma](https://avatars.githubusercontent.com/u/829526?v=4)](https://github.com/prayagverma "prayagverma (3 commits)")[![1istbesser](https://avatars.githubusercontent.com/u/8143196?v=4)](https://github.com/1istbesser "1istbesser (3 commits)")[![rosemaryreilman](https://avatars.githubusercontent.com/u/7914791?v=4)](https://github.com/rosemaryreilman "rosemaryreilman (2 commits)")[![shur](https://avatars.githubusercontent.com/u/1245155?v=4)](https://github.com/shur "shur (2 commits)")[![spitza](https://avatars.githubusercontent.com/u/163510?v=4)](https://github.com/spitza "spitza (2 commits)")[![spyesx](https://avatars.githubusercontent.com/u/372514?v=4)](https://github.com/spyesx "spyesx (2 commits)")[![ngengs](https://avatars.githubusercontent.com/u/5084276?v=4)](https://github.com/ngengs "ngengs (2 commits)") ### Embed Badge ![Health badge](/badges/oneistbesser-owl-carousel/health.svg) ``` [![Health](https://phpackages.com/badges/oneistbesser-owl-carousel/health.svg)](https://phpackages.com/packages/oneistbesser-owl-carousel) ``` PHPackages © 2026 [Directory](/)[Categories](/categories)[Trending](/trending)[Changelog](/changelog)[Analyze](/analyze)