Carousel
| Name | Type | Description |
| guvam-carousel | element | |
| index | attribute | |
| setIndex | method | |
| carousel-change | event | |
| carousel-slide | target | |
| carousel-indicator | target | |
| carousel-control-prev | target | |
| carousel-control-next | target | |
| .Carousel | class | |
| .Carousel-SlideList | class | |
| .Carousel-Slide | class | |
| .Carousel-IndicatorList | class | |
| .Carousel-Indicator | class | |
| .Carousel-Control | class |
Carousel
Fun
Smile
Laugh
Happy
Grin
<guvam-carousel class="Carousel" index="0">
<div class="Carousel-SlideList">
<div class="Carousel-Slide active" data-target="carousel-slide"> Fun </div
><div class="Carousel-Slide" data-target="carousel-slide"> Smile </div
><div class="Carousel-Slide" data-target="carousel-slide"> Laugh </div
><div class="Carousel-Slide" data-target="carousel-slide"> Happy </div
><div class="Carousel-Slide" data-target="carousel-slide"> Grin </div>
</div>
<div class="Carousel-IndicatorList">
<button class="Carousel-Indicator active" data-target="carousel-indicator"></button
><button class="Carousel-Indicator" data-target="carousel-indicator"></button
><button class="Carousel-Indicator" data-target="carousel-indicator"></button
><button class="Carousel-Indicator" data-target="carousel-indicator"></button
><button class="Carousel-Indicator" data-target="carousel-indicator"></button>
</div>
<button class="Carousel-Control type-prev" data-target="carousel-control-prev"> <i class="Icon arrow-left"></i> </button>
<button class="Carousel-Control type-next" data-target="carousel-control-next"> <i class="Icon arrow-right"></i> </button>
</guvam-carousel>
Fade In Carousel
Fun
Smile
Laugh
Happy
Grin
<guvam-carousel class="Carousel" index="0">
<div class="Carousel-SlideList">
<div class="Carousel-Fade-In active" data-target="carousel-slide"> Fun </div
><div class="Carousel-Fade-In" data-target="carousel-slide"> Smile </div
><div class="Carousel-Fade-In" data-target="carousel-slide"> Laugh </div
><div class="Carousel-Fade-In" data-target="carousel-slide"> Happy </div
><div class="Carousel-Fade-In" data-target="carousel-slide"> Grin </div>
</div>
<div class="Carousel-IndicatorList">
<button class="Carousel-Indicator active" data-target="carousel-indicator"></button
><button class="Carousel-Indicator" data-target="carousel-indicator"></button
><button class="Carousel-Indicator" data-target="carousel-indicator"></button
><button class="Carousel-Indicator" data-target="carousel-indicator"></button
><button class="Carousel-Indicator" data-target="carousel-indicator"></button>
</div>
<button class="Carousel-Control type-prev" data-target="carousel-control-prev"> <i class="Icon arrow-left"></i> </button>
<button class="Carousel-Control type-next" data-target="carousel-control-next"> <i class="Icon arrow-right"></i> </button>
</guvam-carousel>
Auto-Sliding Carousel
Fun
Smile
Laugh
Happy
Grin
<guvam-carousel class="Carousel" auto-slide="true" index="0">
<div class="Carousel-SlideList">
<div class="Carousel-Slide active" data-target="carousel-slide"> Fun </div
><div class="Carousel-Slide" data-target="carousel-slide"> Smile </div
><div class="Carousel-Slide" data-target="carousel-slide"> Laugh </div
><div class="Carousel-Slide" data-target="carousel-slide"> Happy </div
><div class="Carousel-Slide" data-target="carousel-slide"> Grin </div>
</div>
<div class="Carousel-IndicatorList">
<button class="Carousel-Indicator active" data-target="carousel-indicator"></button
><button class="Carousel-Indicator" data-target="carousel-indicator"></button
><button class="Carousel-Indicator" data-target="carousel-indicator"></button
><button class="Carousel-Indicator" data-target="carousel-indicator"></button
><button class="Carousel-Indicator" data-target="carousel-indicator"></button>
</div>
<button class="Carousel-Control type-prev" data-target="carousel-control-prev"> <i class="Icon arrow-left"></i> </button>
<button class="Carousel-Control type-next" data-target="carousel-control-next"> <i class="Icon arrow-right"></i> </button>
</guvam-carousel>