Hi,
Please anyone knows how to add multiple "news Carousel" sliders to a web page. This example is not seems working for multiple usage. How can I update this code for multiple usage.
Please help???
yasitha Nawagamuwa () - 8 years ago - Reply 0
in order to solve it just replace the css class #myCarousel .list-group .active with #myCarousel .list-group-item .active
and then edit the 1st js function with the next function
$(document).ready(function () {
var clickEvent = false;
var count = 0;
var co = $('#myCarousel').children();
count = co[0].childElementCount - 1;
$('#myCarousel').carousel({
interval: 4000
}).on('click', '.list-group li', function () {
clickEvent = true;
$('.list-group li').removeClass('active');
$(this).addClass('active');
}).on('slid.bs.carousel', function (e) {
if (!clickEvent) {
var current = $('.list-group li.active');
var current1 = $('.list-group-item lactive');
current.removeClass('active').next().addClass('active');
current1.removeClass('active').next().addClass('active');
var id = parseInt(current.data('slide-to'));
if (count == id) {
$('.list-group li').first().addClass('active');
console.log($('.list-group li').first());
}
if (count == id) {
$('.list-group-item').first().addClass('active');
}
}
clickEvent = false;
});
})
AgentC004 () - 8 years ago - Reply 0
If I want to use bigger sized pictures, what does this imply concerning the code ? The inconvenience seems to be that the text covers a part of the image. And : How do I put the text below the image ? (I must admit that I am a newbie. Concerning the pictures I have some which are in portrait, other in landscape format - seems to be quite difficult to fit them together ... - Would even say in this sample portrait sized pictures would be even more convenient ... )
Franz Fakler () - 9 years ago - Reply 0
The sliding works perfect, but no matter which button I'm pressing the first one (Lorem ipsum) keeps being selected. What do I need to do?
Даулет Ðмирханов () - 9 years ago - Reply 0
is there any answer to this question?
The sliding works perfect, but no matter which button I'm pressing the first one (Lorem ipsum) keeps being selected. What do I need to do?
DBen (-1) - 5 years ago - Reply -1
Change the trigger box resizing to a function and call it on load and resize. Works well for me.
$(window).resize(function() {
setTriggerHeight();
});
$(window).load(function() {
setTriggerHeight();
});
function setTriggerHeight() {
var boxheight = $('#myCarousel .carousel-inner').innerHeight();
var itemlength = $('#myCarousel .item').length;
var triggerheight = Math.round(boxheight/itemlength+1);
$('#myCarousel .list-group-item').outerHeight(triggerheight);
}
Andy Urban () - 9 years ago - Reply 0
This resolved the resizing issue for me in Chrome, Firefox, and Safari for Mac. Thanks.
Chris Rouse () - 9 years ago - Reply 0
In the JS
var triggerheight = Math.round(boxheight/itemlength+1);
replace
var triggerheight = Math.round(boxheight/itemlength+81);
Jorge Tuyin () - 10 years ago - Reply 0
Here is the fix:
http://bootsnipp.com/snippe...
Move the code that change the items height to a window.load function.
If there is another way to do that, please tell me.
Jean Brito () - 10 years ago - Reply 0
I don't think anybody cares. I would love to use this and have spent some time trying to fix it to no avail. It needs to be removed if it doesn't work
Jeremy () - 10 years ago - Reply 0
Doesn't work on Safari or Firefox. List items are scrunched together. Refreshing does not help
abrudtkuhl () - 10 years ago - Reply 0
Sometimes it needs a page refresh for some reason... try doing that and seeing it again.
maxsurguy () - 10 years ago - Reply 0
This is cool but it doesn't work at all in Safari and doesn't work consistently in Chrome/Firefox. It's even broken on the bootsnipp page for me with Safari.
Dan Butler () - 10 years ago - Reply 0
Beautiful carousel but I'm having some problems as well. . .
Not sure if I'm experiencing the same issue but sometimes when it loads the list box items are all scrunched together. Sometimes a refresh fixes but sometimes not, it's very inconstant.
Jeremy () - 10 years ago - Reply 0
