Basic jQuery Automatic Content Slider Plugin - Text Slider

File Size: 3.54 KB
Views Total: 24900
Last Update:
Publish Date:
Official Website: Go to website
License: MIT
Basic jQuery Automatic Content Slider Plugin - Text Slider

Text Slider is a minimalist (~1kb) jQuery plugin that enables you to cycle through any number of Html content (text, images, etc...) with smooth transition effects based on jQuery animate() method.

How to use it:

1. Include jQuery library and the jQuery text slider plugin on your html page.

<script src="//"></script>
<script src="js/text-slider.js"></script>

2. Add slider items as displayed below.

<div class="slide">
  <div class="slider-item">
   Slide 1
  <div class="slider-item">
   Slide 2
  <div class="slider-item">
   Slide 3

3. Initialize the plugin on the parent container and we're done.


4. Config the text slider plugin.


timeout: 2000,
slideTime: 750,
loop: 1


Change logs:


  • added loop.


  • JS rewrite.

This awesome jQuery plugin is developed by NathanBastiaans. For more Advanced Usages, please check the demo page or visit the official website.