Simple Content Slider with Pure CSS - Gallery CSS
File Size: | 489KB |
---|---|
Views Total: | 36187 |
Last Update: | |
Publish Date: | |
Official Website: | Go to website |
License: | MIT |
Gallery CSS is a simple and lightweight content slider built only with Html and CSS that supports all the html elements. It also provides a jQuery plugin version for Internet Explore 8.
Features:
- Support for Auto Play
- Suuprot for transition animation between content
- Custom controls
- Bullet navigation
- Pure CSS, not a script to be found
How to use it:
1. Include gallery.css and theme css on your web page
<link rel="stylesheet" href="gallery.css"> <link rel="stylesheet" href="gallery.theme.css">
2. Markup html structure
<div class="gallery autoplay items-3"> <div id="item-1" class="control-operator"></div> <div id="item-2" class="control-operator"></div> <div id="item-3" class="control-operator"></div> <figure class="item"> <h1>Item 1</h1> </figure> <figure class="item"> <h1>Item 2</h1> </figure> <figure class="item"> <h1>Item 3</h1> </figure> <div class="controls"> <a href="#item-1" class="control-button">•</a> <a href="#item-2" class="control-button">•</a> <a href="#item-3" class="control-button">•</a> </div> </div>
3. With browser prefixes (optional)
<script src="./js/prefixfree.min.js"></script>
This awesome jQuery plugin is developed by benschwarz. For more Advanced Usages, please check the demo page or visit the official website.