kineto ·
Kineto is an open source JavaScript library for building carousels on websites. It aims to cover every essential feature of a carousel while staying simple and intuitive for integration.
kineto works on all ECMAScript 5 compliant browsers. We have no plan to support IE 8 and prior that are unable to parse compressed source codes.
Please download the latest version of kineto. Ready-to-use resources are located in /dist
folder.
<!DOCTYPE html>
<html>
<head>
<link rel="stylesheet" href="kineto.css" />
</head>
<body>
<script src="kineto.js"></script>
</body>
</html>
- Insert the CSS and JS files into your HTML.
- The CSS file contains opinionated theme for Kineto's submodules. You don't need to include it if you are going to create your own look and feel.
- The JS file is placed at the end of body element for improved performance.
You only need to have a container holding your content slides as direct children elements. class
and accessibility attributes will be automatically added once you enable Kineto.
<div id="carousel">
<div>Slide 1</div>
<div>Slide 2</div>
<div>Slide 3</div>
</div>
Once DOM is ready, you can now initialize kineto with Kineto.create()
method.
Kineto.create('#carousel', { pagination: true });
Kineto is applied to all elements matching the selector provided. To control only a specific instance, we recommend you to use either a unique selector or an element object instead the selector.
More detailed informations are available on documentation page.