The Bootstrap 4 slider with text animation has three most important sections
1. Carousel indicators
The Carousel indicators provide the current position of the slide to the users and also provide alternate navigation for the slide to the users to move from one slide to another slide.
The carousel item class is located in a wrapper container with a class of. .Carousel-inner. The Carousel item represents each slide. In the carousel item, you can add your images and also add the caption with different-different animation.
<!-- first slide -->
<div class="carousel-item active">
<img src="images/html-css-tutorials-banner-1.jpg" alt="Bootstrap 4 slider with text animation" />
<div class="carousel-caption d-md-block">
<h3 data-animation="animated bounceInLeft">
<h3 data-animation="animated bounceInRight">
Bootstrap 4 slider with text animation
<button class="btn btn-primary btn-lg" data-animation="animated zoomInUp">
3. Carousel Control
The carousel-control has a navigation arrow that allows users to next and previous the previous image slides.
The Main Features of Bootstrap 4 slider with text animation
1. Highly Customizable
Every slideshow parameter will be simply customized to suit your web page design and your needs. Bootstrap 4 slider with text animation key features of like the navigation arrow (with Prev/next bullets), auto-play, loop, random order, text descriptions with animations.
2. Responsive Design
Bootstrap 4 slider with text animation is brilliantly responsive with any template, effect, options you select. It doesn’t matter what device people access your website from, the slider will look constantly excellent.
3. Full-width slider
In contrast to full width, the boxed layout option allows users to set your slider to span the whole width of the browser to make your images stand out without scroll.
4. Touch/swipe navigation arrow
With the rising trend of mobiles, it is necessary that your website be accessible on all gadgets like mobile, Tablet and desktop or laptop. HTML slideshow contains the support for touch screen gestures to ensure that your visitors receive a clean, native-like experience.
5. Browsers Support
Bootstrap Slider runs perfectly in all browsers, like IE6+, Firefox, Safari, Google Chrome Opera, iOS and Android. It has a well-structured and clear HTML and CSS code, readable by any search engine.
How To Create a Carousel
The following example shows how to create a bootstrap 4 slider with text animation: