• Features
  • Demo
  • Documentation
  • Download

Features

  • Light weight.
  • Cross browser support.
  • No CSS and programming knowledge required.
  • Can add unlimited slides.
  • Play/Pause feature.
  • Can slide any element any where.
Buy me a coffee !

Buy me coffee !

If you like this work and found this useful buy me a coffee ! your donation will motivate me to develop and support this work.

Demo

Click the button below to view the example and demonstrations of lite content slider plugin.

Download

Click the button below to download.

Documentation

Basic Usage

$('.sliderWrap').liteSlider({
	content : '.sliderContent',	// The sliding content selector. Can be a list also. eg:li
	width : 760,			// Width of the slider
	height : 300,			// Height of the slider
	autoplay : true,		// Autoplay the slider. Values, true & false
	delay : 3,			// Transition Delay. Default 3s
	buttonsClass : 'buttons',	// Button's class
	activeClass : 'active',		// Active class
	controlBt : '.control',		// Control button selector
	playText : 'Play',		// Play text
	pauseText : 'Stop'		// Stop text
});

Steps in creating a slider

  1. Include Jquery and this plugin to the document head.
  2. Create a wrapper for the sliding contents with <div> or <span> of any class / ID . eg: .sliderWrap
    <div class="sliderWrap">
    
    </div>
  3. Create as many sliding contents within the main wrapper of same class eg: .sliderContent
    <div class="sliderWrap">
         <div class="sliderContent">
              Content 1 goes here
         </div>
    	 
         <div class="sliderContent">
              Content 2 goes here
         </div>
    	 
         <div class="sliderContent">
              Content 3 goes here
         </div>
    	 
         <div class="sliderContent">
              Content 4 goes here
         </div>
    	 
    </div>
  4. Attach the plugin to the slider wrapper, with the property content to the class of the sliding element.

Add your comment 105 Comments so far