multiple Carousel


Topic: multiple Carousel
I added carousel images dynamically in the div using Jquery, but images sliding is not working... please find the below code ...
please help me out
$("#addPrivateTravel").append("<div class='col-md-4'><div class='card mb-4'><div class='view overlay' id='" + obj.name + "_"+obj.id+"' name='" + obj.id + "' onclick='getPrivateToureDetails1(this)'><div id='carousel-example-" + obj.id + "' class='carousel slide carousel-fade' data-ride='carousel'><ol class='carousel-indicators'><li data-target='#carousel-example-" + obj.id + "' data-slide-to='0' class='active'></li><li data-target='#carousel-example-" + obj.id + "' data-slide-to='1'></li><li data-target='#carousel-example-" + obj.id + "' data-slide-to='2'></li></ol><div class='carousel-inner' role='listbox'><div class='carousel-item active'><img class='card-img-top' src='./img/groupTravelImages/"+(name).toLowerCase()+"/landingSlidersImages/image_1.jpg' alt='Card image cap'></div><div class='carousel-item'><img class='card-img-top' src='./img/groupTravelImages/"+(name).toLowerCase()+"/landingSlidersImages/image_2.jpg' alt='Card image cap'></div><div class='carousel-item'><img class='card-img-top' src='./img/groupTravelImages/"+(name).toLowerCase()+"/landingSlidersImages/image_3.jpg' alt='Card image cap'></div></div></div><a href='#!'><div class='mask rgba-white-slight'></div></a></div><div class='card-body text-left'><h4 class='card-title text-capitalize'>" + obj.name + "</h4><hr/><div class='tourPlaceDetails'><div class='tourPlaceDetailsInnerDivs1' style='text-align: center'><div></div></div></div><button type='button' id='" + obj.name + "' name='" + obj.id + "' class='btn btn-light-blue btn-sm pull-right active' onclick='getPrivateToureDetails(this)'>Know more</button></div></div></div>")
$('.carousel').carousel({
interval:5000
})

Piotr Glejzer staff answered 6 years ago

Hi, may you use our snippets to showing your code? It will be an easier way. Thank you. Best, Piotr
Please insert min. 20 characters.

FREE CONSULTATION

Hire our experts to build a dedicated project. We'll analyze your business requirements, for free.

Status

Answered

Specification of the issue
  • User: Free
  • Premium support: No
  • Technology: MDB jQuery
  • MDB Version: 4.5.5
  • Device: laptop
  • Browser: crome
  • OS: windows
  • Provided sample code: Yes
  • Provided link: No