jQuery Flader is a plugin who can use as dependencies jQuery Transit to perform css3 transition. Slide can fade or slide, it can perform auto sliding / fading and have a custom mousehold event
jQuery (last version as possible) jQuery Transit (optional but smoother animation!)
<!doctype html>
<html>
<head>
<link rel=stylesheet href='flader.css'><!-- base css -->
<script src='jquery.js'></script>
<script src='jquery.transit.js'></script><!-- if you want css3 animation -->
<script src='jquery.flader.js'></script>
</head>
<body>
<div id="fader">
<ul data-function="slider_content">
<li data-function="slider_item"><p>content</p></li>
<li data-function="slider_item"><p>content</p></li>
</ul>
</div>
<div id="slider">
<ul data-function="slider_content">
<li data-function="slider_item"><p>content</p></li>
<li data-function="slider_item"><p>content</p></li>
<li data-function="slider_item"><p>content</p></li>
</ul>
</div>
<script>
$(function(){
$('#fader').Flader({
slide_type: 'fade'
});
$('#slider').flader();
});
</script>
</body>
</html>Custom class for nav buttons Default: ''
Custom class for btn wrap Default: ''
Slide type of the slider ( 'slider' or 'fade' ) Default: 'slide'
Animation Speed in millisecond Default: 500
Easing of the animation, can support all the easing supported by Jquery.transit Default: ''
Mouse event who performe the slide support a custom event 'mousehold' who let the slide continue when mouseclick maintained In mousehold, easing will be 'linear' Default: 'click'
Define if sliding infinitely Only in slide mod Autoslide disabled when set to false due to the ugly effect if return to first/last slide item. Default: 5000
When set at true, the slider will perform an autoslide every each @auto_slide_delay Default: false
Delay between each auto slidein millisecond Default: 5000
callback launch when slide performed, can be used to animate inside the next slide
The current slide item and the next item displayed, jquery objects
React
Typescript
Django
Laravel
Facebook
Microsoft
Google
Alibaba
D3
Tencent