Featurecarousel.js 3d Carousel Diagram Plugin

Source: Internet
Author: User

JQuery Feature Carousel Plugin is a relatively excellent carousel image plugin abroad. Click here to enter the original text.

Plug-in Features:

1. Handle the 3d carousel effect of Div.

2. Support for one center, 2 side functions

3. The center area can be clicked

4. Show hidden text function (can be displayed anywhere in the picture using CSS)

5. Can modify the speed, effect, and many other parameters.

6. Support Chrome,firefox,safari and IE6 + browser.

7. Need jquery v1.3+

8. Support for picture pre-loading

How to use:

1. Introduction of jquery v1.3+ and Carousel.js files

2. Introduce the appropriate CSS file

3. Format your HTML.

4. Enable your carousel.js as follows

[HTML]View PlainCopy
  1. <script type="Text/javascript">
  2. $ (document). Ready (function () {
  3. $ ("#carousel"). Featurecarousel ({
  4. Include options like this:
  5. (use quotes with string values, and no trailing comma after last option)
  6. Option:value,
  7. Option:value
  8. });
  9. });
  10. </Script>



Configuration parameters:

Name Describe Type Default value
Largefeaturewidth In 3 cases, "0" means width is displayed in the original size, the actual width of "0" "1" is multiplied by this value, greater than "1", and the width can be customized Integer 0
Largefeatureheight Ditto, for the height of the picture Integer 0
Smallfeaturewidth In 3 cases, "0" means width is displayed in the original size, the actual width of "0" "1" is multiplied by this value, greater than "1", and the width can be customized Integer 0.5
Smallfeatureheight Ibid., changed to height Integer 0.5
TopPadding Padding value above the perimeter container Integer 20
Sidepadding Left and right padding values from the perimeter container Integer 50
Smallfeatureoffset Examples of container examples for both sides of content Integer 50
Startingfeature The serial number placed in the center Integer 1
Carouselspeed Time to complete a carousel Integer 1000
AutoPlay Greater than 0, the time interval for the carousel to run. equals 0 means not automatically running Integer 4000
Pauseonhove Mouse on the tentative Boolean True
Onhover Put the mouse on the stop Boolean False
Stoptrackerindividual Boolean True
Trackersummation Boolean True
Preload Boolean True
Displaycutoff Integer 0
Animationeasing Caching effects (used with easing plug-ins) String ' Swing '
Leftbuttontag Left-scrolling button String ' #carousel-left
Rightbuttontag Right-scrolling button String ' #carousel-right '
Captionbelow Title at the bottom of the picture Boolean False
Movedtocenter Move into center-triggered callback function function $.noop
Leavingcenter callback function from center trigger function $.noop
Clickedcenter Click the middle link to send the callback function function $.noop

Featurecarousel.js 3d Carousel Diagram Plugin

Contact Us

The content source of this page is from Internet, which doesn't represent Alibaba Cloud's opinion; products and services mentioned on that page don't have any relationship with Alibaba Cloud. If the content of the page makes you feel confusing, please write us an email, we will handle the problem within 5 days after receiving your email.

If you find any instances of plagiarism from the community, please send an email to: info-contact@alibabacloud.com and provide relevant evidence. A staff member will contact you within 5 working days.

A Free Trial That Lets You Build Big!

Start building with 50+ products and up to 12 months usage for Elastic Compute Service

  • Sales Support

    1 on 1 presale consultation

  • After-Sales Support

    24/7 Technical Support 6 Free Tickets per Quarter Faster Response

  • Alibaba Cloud offers highly flexible support services tailored to meet your exact needs.