Я хочу добавить 2 слайд-шоу на одну веб-страницу, так что это код для 1 слайд-шоу
<script>
var slideIndex = 0;
var slides = document.getElementsByClassName("mySlides1");
showSlides();
function showSlides() {
var i;
for (i = 0; i < slides.length; i++) {
slides[i].style.display = "none";
}
slideIndex++;
if (slideIndex> slides.length) {slideIndex = 1}
slides[slideIndex-1].style.display = "block";
setTimeout(showSlides, 3000); // Change image every 5 seconds
}
function currentSlide(no) {
var i;
for (i = 0; i < slides.length; i++) {
slides[i].style.display = "none";
}
slideIndex = no;
slides[no-1].style.display = "block";
function plusSlides(n) {
var newslideIndex = slideIndex + n;
if (newslideIndex < 6 && newslideIndex > 0){
currentSlide(newslideIndex);
}
}
</script>
затем я хотел добавить еще одно слайд-шоу, поэтому я добавил mySlides2
var slides = document.getElementsByClassName("mySlides1", "mySlides2");
но это не работает.
все еще не работает .. myslides2 пуст
Разделите элементы слайда на две HTMLCollections, а затем объедините их в один массив.
var slide1 = document.getElementsByClassName("mySlides1");
var slide2 = document.getElementsByClassName("mySlides1");
var slides = [];
for(var i = 0; i < slide1.length; i++){
slides[i] = slide1[i];
}
for(var length = slide1.length, i = length; i < slide2.length+length; i++ ){
slides[i] = slide2[i - length];
}
//showSlides();
document.querySelectorAll('.mySlides1, .mySlides2');
попробуйте это вместоgetElementsByClassName