test/ant-design
1
0
Fork 0
mirror of https://gitee.com/ant-design/ant-design.git synced 2024-12-15 09:21:22 +08:00
Code Issues Actions 19 Packages Projects Releases Wiki Activity
87c436cccc
ant-design/components/carousel/index.en-US.md
MadCcc 40e77c40d3
docs: overview dark cover (#40666) 
* docs: add dark overview

* docs: show dark cover in dark theme

* docs: update cover
2023-02-09 22:17:31 +08:00

2.0 KiB
Raw Blame History

category group title cover coverDark demo
Components Data Display Carousel https://mdn.alipayobjects.com/huamei_7uahnr/afts/img/A*bPMSSqbaTMkAAAAAAAAAAAAADrJ8AQ/original https://mdn.alipayobjects.com/huamei_7uahnr/afts/img/A*a-58QpYnqOsAAAAAAAAAAAAADrJ8AQ/original
cols
2

A carousel component. Scales with its container.

When To Use

  • When there is a group of content on the same level.
  • When there is insufficient content space, it can be used to save space in the form of a revolving door.
  • Commonly used for a group of pictures/cards.

Examples

Basic Position Scroll automatically Fade in

API

Property Description Type Default Version
autoplay Whether to scroll automatically boolean false
dotPosition The position of the dots, which can be one of top bottom left right string bottom
dots Whether to show the dots at the bottom of the gallery, object for dotsClass and any others boolean | { className?: string } true
easing Transition interpolation function name string linear
effect Transition effect scrollx | fade scrollx
afterChange Callback function called after the current index changes function(current) -
beforeChange Callback function called before the current index changes function(from, to) -

Methods

Name Description
goTo(slideNumber, dontAnimate) Go to slide index, if dontAnimate=true, it happens without animation
next() Change current slide to next slide
prev() Change current slide to previous slide

Find more APIs in react-slick documentation.

FAQ

How to add custom arrows?

See #12479.