Random Article


 
Don't Miss
 

jQuery OneByOne Slider Plugin

 
 
Overview
 

Author: sike
 
Date: Oct, 2011
 
Area: ,
 
Buyer Rating
 
 
 
 
 


 
$5.00


Summary

The OneByOne Slider is a lightweight jQuery plugin you can use to display your image and text one by one. The CSS3 animation is driven by Animate.css. It’s mobile friendly, which support wipe left/right on your touch device like iPhone & iPad. You can drag and drop to navigate with your mouse too. Purchase the […]

0
Posted August 4, 2012 by admin

 
Features
 
 

The OneByOne Slider is a lightweight jQuery plugin you can use to display your image and text one by one. The CSS3 animation is driven by Animate.css. It’s mobile friendly, which support wipe left/right on your touch device like iPhone & iPad. You can drag and drop to navigate with your mouse too.

Purchase the extended license?

I appreciate if you can put this item’s link in your item’s description when use it in a theme.

Like to pause the slideshow when mouse hover?

Please drop me a line via my profile page’s contact form. I can send you the update source.

About the CSS3 transition

Note: The CSS3 transition only works in the modern browser like Firefox, Safar and Chrome. Which doesn’t work in IE7 , 8 & 9, it seems the IE 10 will support it.

Available plugin settings

className: 'oneByOne', // the wrapper's name
sliderClassName: 'oneByOne_item',  // the each slider div's class name
easeType: 'fadeInLeft',  // the ease animation style
width: 960,  // width of the slider
height: 420, // height of the slider
delay: 300,  // the delay of the touch/drag tween
tolerance: 0.25, // the tolerance of the touch/drag  
enableDrag: true,  // enable or disable the drag function by mouse
showArrow: true,  // display the previous/next arrow or not
showButton: true,  // display the circle buttons or not
slideShow: false,  // auto play the slider or not
slideShowDelay: 3000 // the delay millisecond of the slidershow

Available easeType

‘rollIn’, ‘fadeIn’, ‘fadeInUp’, ‘fadeInDown’, ‘fadeInLeft’, ‘fadeInRight’, ‘fadeInRight’, ‘bounceIn’, ‘bounceInDown’, ‘bounceInUp’, ‘bounceInLeft’, ‘bounceInRight’, ‘rotateIn’, ‘rotateInDownLeft’, ‘rotateInDownRight’, ‘rotateInUpLeft’, ‘rotateInUpRight’ or ‘random’

Features:

  • CSS3 driven animation, hardware accelerated CSS3 transitions for supported modern browser.
  • Mobile friendly, you can use it in a touch device.
  • It’s lightweight, the compressed javascript is only 4kb.
  • Optional auto delay slideshow.
  • Optional drag function of mouse.
  • Optional animation style, can be in random or any other type.
  • Optional arrow and buttons.
  • FAQ is included in the source package.
  • Free update, you can download the future update for free.


0 Comments



Be the first to comment!


Leave a Response

(required)