Thank you for purchasing Tikslus Carousel. If you have any questions that are beyond the scope of this help file, please feel free to email via my user page contact form here. Thanks so much! |
Tikslus Carousel was created to be responsive.It Can be view full page or you can provide a specific Width and Height for the plugin.
Download and Unzip:
|
Installation: Installing Tikslus Carousel is very easy and straight-forward. Simply add the following link and scripts tags with your proper paths and paste the following code within the Head tags of your HTML document.
|
How to use plugin ? Using Tiksluscarousel is easy.After including carousel css and js files. Inside a DIV element create an unordered list of images you want to use in carousel. HTML markup
Make sure you have the same (width and height) for all images |
Activate using Jquery selector Using Jquery selectory inside $(document).ready() or $(window).load() to activate carousel.
|
Parameter | Default value | Allowed Value | Description |
---|---|---|---|
current | 1 | Any number (>0) not greater than total images in the carousel | You can specify from which item the carousel should start |
prev | "«"
| HTML code to specify Previous button | Defines Previous button on the carousel |
next | "»"
| HTML code to specify Next button | Defines Next button on the carousel |
type | slide | slide,rotate or custom |
|
autoplayInterval | 7000 (7 seconds) | value in milliseconds | Carousel can auto-scroll. This is enabled by specifying a millisecond value to this option. The value you specify is the amount of time between 2 consecutive slides. |
animationInterval | 800 | value in milliseconds | defines sliding speed of your carousel. Higher the value slower is the sliding effect. |
dotRatio | 0.02 | Always in percentage. 2% by default | defines the width and height of dots. It is specified as percentage values to make it reponsive. |
loader | ajax-loader.gif | ajax loader gif image (can be specified with full path) | Ajax loader gif image to be shown during image pre loading. |
customAnimationClassIn | null | CSS3 class name | Specifies the name of CSS3 class which defines the entrace effect. To use this option you must set type parameter to custom. example:
|
customAnimationClassOut | null | CSS3 class name | Specifies the name of CSS3 class which defines the exit effect. To use this option you must set type parameter to custom. example:
|
customAnimationCaption | null | CSS3 class name | If this option is set as NULL. Captions will slide in. |
captionAnimationInterval | 100 | value in milliseconds | Speed of caption animation |
captionFontRatio | 0.15 | value between 0.1 to 1 | font size of text used in captions. |
width | 0 | width of image. (without specifying any unit) | Defines the width of the images used in carousel. If set to 0 carousel will take Parent wrappers width or body tag width |
height | 0 | Height of image. (without specifying any unit) | Defines the Height of the images used in carousel. If set to 0 carousel will take Parent wrappers Height or body tag Height |