Cycle Through Large HTML Lists And Tables With jQuery Cyclops Plugin

File Size: 4.67 KB
Views Total: 276
Last Update:
Publish Date:
Official Website: Go to website
License: MIT
   
Cycle Through Large HTML Lists And Tables With jQuery Cyclops Plugin

Cyclops is a lightweight jQuery plugin (under 1kb) that breaks down large HTML lists or tables into smaller sections.

It then automatically cycles through these portions with/without a slide animation, offering a smooth and user-friendly browsing experience.

How to use it:

1. Download and load the jquery.cyclops.min.js script after jQuery.

<script src="/path/to/cdn/jquery.min.js"></script>
<script src="/path/to/jquery.cyclops.min.js"></script>

2. Call the function on your HTML list or table and specify the number of entries to show per view.

$("ul,table").cyclops({ 
  // default: 5
  maxItems: 3,
});

3. Set the time wait before transitioning to the next view.

$("ul,table").cyclops({
  // default: 10000
  delay: 5000,
});

4. Determine whether to enable the slide animation.

$("ul,table").cyclops({
  // default: false
  animate: true,
});

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