A Simple 3D & Responsive Image Carousel

Easy navigation to:

Intro

MK 3D Carousel is a simple & a responsive 3D Image Carousel plugin created using JQUERY & CSS3.

Dependencies

jQuery
CSS 3

Installation

Install jQuery

1
  $ npm install --save jquery

Install mk-3dcarousel

1
  $ npm install --save mk-3dcarousel

or download it from here. Post-installation, include CSS & JS files to your page.

HTML Usage

1
2
3
4
5
  <div class="mk-carousel" id="mkCarousel">
    <img class="active" src="<your-path>/file-name-01.jpg" alt="File Name 1">
    <img src="<your-path>/file-name-02.jpg" alt="File Name 2">
    <!-- ... Image list goes here -->
  </div>

Add mk-carousel class to the wrapper element and list the images you want in the carousel as defined in the above fashion.

JavaScript Usage

1
2
3
4
5
  $(function(){
    $('#mkCarousel').mkCarousel({
      // Options goes here
    });
  });

Have a look here for options to customize your carousel.

Demo

Click here for demo.

Support

IE 10+
Firefox 10+
Google Chrome 12+
Safari 9+
Android Browser 3+