图像传送带问题

时间:2019-03-11 15:47:59

标签: javascript css3 bootstrap-4

我在使用Bootstrap 4时遇到图像库轮播问题,该问题在Bootstrap 3中运行良好。我分别附上了BS3和BS4图像库的屏幕截图

Bootstrap 3

Bootstrap 4

Javascript / Jquery

var sliderImages = document.getElementById('thumbImages').getElementsByTagName("img");
for (var i = 0; i < sliderImages.length; i++) {
sliderImages[i].onmouseover = function() {
this.style.cursor = "hand";
this.style.borderColor = "red";
this.style.borderWidth = "2px"
}
sliderImages[i].onmouseout = function() {
this.style.cursor = "pointer";
this.style.borderColor = "grey"
}
}

function changeImg(event) {
event = event || window.event;
var targetElement = event.target || window.srcElement;
if (targetElement.tagName == "IMG") {
document.getElementById("mainImage").src = targetElement.getAttribute("src")
}
}

$('#myCarousel').carousel({
interval: !1
})
$('.carousel .item').each(function() {
var next = $(this).next();
if (!next.length) {
next = $(this).siblings(':first')
}
next.children(':first-child').clone().appendTo($(this));
for (var i = 0; i < 2; i++) {
next = next.next();
if (!next.length) {
next = $(this).siblings(':first')
}
next.children(':first-child').clone().appendTo($(this))
}
});

0 个答案:

没有答案
相关问题