Topic: multiple Carousel
padmanabham.pakki@gmail.com free asked 6 years ago
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
})
Add comment
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
FREE CONSULTATION
Hire our experts to build a dedicated project. We'll analyze your business requirements, for free.
Status
Answered
Specification of the issue
- ForumUser: 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
Tags