CODEWITHSUNDEEP
htmlcsstwitter-bootstrapbootstrap-4
ashfaqrafi
ashfaqrafi

Reputation: 500

I am using Bootstrap 4 carousel in a code.Bootstrap 4 carousel not working

I am using Bootstrap 4 carousel in a code. But it is showing all the three images that I am using in individual items in a single item at a time. Here is the code:

<div id="carouselExampleControls" class="carousel slide" data-ride="carousel">
                  <div class="carousel-inner">
                    <div class="carousel-item active">
                      <img src="..." class="d-block w-100" alt="...">
                    </div>
                    <div class="carousel-item">
                      <img src="..." class="d-block w-100" alt="...">
                    </div>
                    <div class="carousel-item">
                      <img src="..." class="d-block w-100" alt="...">
                    </div>
                  </div>
                  <a class="carousel-control-prev" href="#carouselExampleControls" role="button" data-slide="prev">
                    <span class="carousel-control-prev-icon" aria-hidden="true"></span>
                    <span class="sr-only">Previous</span>
                  </a>
                  <a class="carousel-control-next" href="#carouselExampleControls" role="button" data-slide="next">
                    <span class="carousel-control-next-icon" aria-hidden="true"></span>
                    <span class="sr-only">Next</span>
                  </a>
                </div>

Now I want to show single image in a single carousel items. In my code what am I doing wrong?

Upvotes: 0

Views: 250

Answers (2)

Blackmask
Blackmask

Reputation: 191

Please make sure Bootstrap 4 CSS and JS files is linkup in your carousel page Specifically, jquery.min.js and popper.min.js and must bootstrap.min.js flies then you paste this code on your carousel page where you want to show

Here you can find more details about carousel Bootstrap Carousel Details

if you setup rightly you can see carousel like this:

enter image description here

Upvotes: 0

muhammad Aqib Rasheed
muhammad Aqib Rasheed

Reputation: 46

As your html code is all good. Please make sure.

  1. Bootstrap 4 css and js files is included properply.
  2. Jquery is included properly.

NOTE: Check console(press F12 and click console) for errors. You must find something there.

Upvotes: 1

Related Questions