The amp-carousel component is used to make an image/content carousel in AMP HTML along the horizontal axis. A carousel is a slideshow of images through a series of images.
Required Scripts: Importing the amp-carousel component in the header.
- type: It specifies the type of carousel. By default, type is set as carousel (all slides scroll horizontally, slides could have different CSS here). It could also be set as slide (single slide shown at a time).
- control: It displays the left and right arrows for user navigation.
- autoplay: When we use this attribute, it moves the carousel on its own.
- loop: Using loop attribute a loop is made i.e. there is right control in the last slide and left control in the first.
- delay: Duration of display of next slide by default it is set as 5000ms and delay cannot be less than 1000ms.
- slide: It is used to specify which slide should go first.
Example 1: Using type=”slides” to display a list of images as slides.
Example 2: Using autoplay attribute with a delay of 3000ms.
- Google Amp amp-ad
- Google AMP amp-accordion
- How to create Nested Accordion using Google AMP amp-accordion?
- How to create Hidden Header using Google AMP amp-accordion?
- How to create Dynamic Header using Google AMP amp-accordion?
- Google AMP amp-facebook-like
- Google AMP amp-date-countdown
- Google AMP amp-brightcove
- Google AMP amp-bind-recaptcha
- Google AMP amp-autocomplete
- How to disable download option in amp-audio in Google AMP ?
- How to set custom media notification with amp-audio in Google AMP ?
- How to set an image placeholder for amp-anim in Google AMP ?
- How to set audio loop in amp-audio of Google AMP ?
- Google AMP amp-img
- Google AMP amp-image-lightbox
- Google AMP amp-lightbox-gallery
- How to calculate area of circle dynamically using amp-bind-macro in Google AMP ?
- What is Initialize state in amp-bind of Google AMP ?
- How to change/update image size dynamically using amp-bind in Google AMP ?
If you like GeeksforGeeks and would like to contribute, you can also write an article using contribute.geeksforgeeks.org or mail your article to email@example.com. See your article appearing on the GeeksforGeeks main page and help other Geeks.
Please Improve this article if you find anything incorrect by clicking on the "Improve Article" button below.