Как добавить Product4 и Product5 в скрипт?
Здравствуйте
Есть скрипт $(document).ready(function(){ counter = 2; // for product 2 $(".next").click(function(){ if(counter == 1) { $(".product1").fadeOut(500); $(".product2").fadeIn(500); $(".h1").animate({top:"-30%"}); $(".h2").animate({top:"50%"}); counter = 2; } else if(counter == 2) { $(".product2").fadeOut(500); $(".product3").fadeIn(500); $(".h2").animate({top:"-30%"}); $(".h3").animate({top:"50%"}); counter = 3; } }); $(".pre").click(function(){ if(counter == 2) { $(".product2").fadeOut(500); $(".product1").fadeIn(500); $(".h1").animate({top:"50%"}); $(".h2").animate({top:"130%"}); counter = 1; } else if(counter == 3) { $(".product3").fadeOut(500); $(".product2").fadeIn(500); $(".h2").animate({top:"50%"}); $(".h3").animate({top:"130%"}); counter = 2; } }); }); Как правильно добавить product4 и product5 в скрипт? Заранее спасибо большое, с уважением. |
Как то так
$(document).ready(function(){ const numproducts = 5 let counter = 2; // for product 2 $(".next").click(function(){ if(counter < numproducts) { $(`.product${counter}`).fadeOut(500); $(`.product${counter+1}`).fadeIn(500); $(`.h${counter}`).animate({top:"-30%"}); $(`.h${counter+1}`).animate({top:"50%"}); counter ++; } }); $(".pre").click(function(){ if(counter > 1) { $(`.product${counter}`).fadeOut(500); $(`.product${counter-1}`).fadeIn(500); $(`.h${counter-1}`).animate({top:"50%"}); $(`.h${counter}`).animate({top:"130%"}); counter--; } }); }) Но вообще это извращение каждому элементу давать класс с номером |
Цитата:
|
Часовой пояс GMT +3, время: 01:00. |