diff --git a/homework-17/img/1.jpg b/homework-17/img/1.jpg
new file mode 100644
index 0000000..757c2a6
Binary files /dev/null and b/homework-17/img/1.jpg differ
diff --git a/homework-17/img/2.jpg b/homework-17/img/2.jpg
new file mode 100644
index 0000000..0b88c91
Binary files /dev/null and b/homework-17/img/2.jpg differ
diff --git a/homework-17/img/3.jpg b/homework-17/img/3.jpg
new file mode 100644
index 0000000..a587c96
Binary files /dev/null and b/homework-17/img/3.jpg differ
diff --git a/homework-17/img/4.jpg b/homework-17/img/4.jpg
new file mode 100644
index 0000000..fa4fd41
Binary files /dev/null and b/homework-17/img/4.jpg differ
diff --git a/homework-17/img/5.jpg b/homework-17/img/5.jpg
new file mode 100644
index 0000000..78704a0
Binary files /dev/null and b/homework-17/img/5.jpg differ
diff --git a/homework-17/img/6.jpg b/homework-17/img/6.jpg
new file mode 100644
index 0000000..494be09
Binary files /dev/null and b/homework-17/img/6.jpg differ
diff --git a/homework-17/img/7.jpg b/homework-17/img/7.jpg
new file mode 100644
index 0000000..030ab8a
Binary files /dev/null and b/homework-17/img/7.jpg differ
diff --git a/homework-17/img/8.jpg b/homework-17/img/8.jpg
new file mode 100644
index 0000000..54c51eb
Binary files /dev/null and b/homework-17/img/8.jpg differ
diff --git a/homework-17/index.html b/homework-17/index.html
new file mode 100644
index 0000000..fc605a1
--- /dev/null
+++ b/homework-17/index.html
@@ -0,0 +1,47 @@
+
+
+
+
+
+
+
+
+
+
+
+
+
+
diff --git a/homework-17/js.js b/homework-17/js.js
new file mode 100644
index 0000000..0f58745
--- /dev/null
+++ b/homework-17/js.js
@@ -0,0 +1,260 @@
+/*
+ TASK 0
+ Отобразите всех лидеров массива.
+ *
+ *
+ * Элемент лидер если он больше чем все последующие элементы
+ * после него ( элементы справа ).
+ * Последний элемент всегда лидер. Например в массиве [16,17,4,3,5,2]
+ * лидеры 17, 5 и 2.
+ *
+ * */
+
+
+ let result = [];
+const solution = arr => {
+ let arrStatic = [];
+ let indexToSplice = 0
+ //клонирую массив
+ arr.forEach((value) => {
+ arrStatic.push(value)})
+ // сортирую оригинал
+ let arrSorted = arr.sort((a, b) => {
+ return a > b;})
+ // из сортированного выбераю самый большой елемент
+ let biggesrElem = arrSorted[arrSorted.length - 1]
+ // из сортированного выбераю самый маленький елемент
+ let minElem = arrStatic[arrStatic.length - 1]
+ // добавляю в массив "лидера"
+ result.push(biggesrElem)
+ // ищу индекс самого большого
+ arrStatic.forEach((elem, index, arr) => {
+ if (biggesrElem == elem) {
+ indexToSplice = index;}
+ }, 0)
+ // режу массив до самого большего елемента
+ arrToSplice = arrStatic.splice(indexToSplice + 1, arrStatic.length);
+ if (arrToSplice.length > 1) {
+ //добавляю массив в рекурсивную функцию
+ return solution(arrToSplice)
+ } else {
+ result.push(minElem)
+ return result
+ }
+}
+// console.log(solution([16, 17, 4, 3, 5, 2])); // === [17, 5, 2]
+// console.log(solution([4, 3, 7, 12, 6, 67, 5, 45, 34, 35, 2, 8])); // [67, 45, 35, 8]
+// console.log(solution([12, 10, 12, 8, 7, 6])); // [12, 8, 7, 6]
+// console.log(solution([1, 2, 3, 4, 5, 4])); // [5, 4]
+// console.log(solution([12, 12, 12]));
+
+
+
+/* TASK 1
+ * Сделайте карусель.
+ * При клике по кнопке "<=" показывается предыдущее изображение по "=>" следующее.
+ *
+ * 1.1
+ * Сделайте слайдер - бесконечным, после третьего изображения снова первое.
+ * 1.2
+ * Добавьте внизу цифры с текущим активным изображением.
+ *
+ @SUPER -> @front-end
+ * Уберите в стилях li - position:absolute.
+ * изменяйте свойство transform:translate 3d у .carousel, добавьте transition
+ * и сделайте чтобы картинки передвигались влево и вправо
+ *
+ * @PUPER -> переход к первой картинкu
+ *
+ * */
+
+// class Carousel {
+// constructor(options) {
+// this.prevBut =options.prevBut
+// this.nextBut =options.nextBut
+// this.img =options.img
+//
+// this.i = options.i;
+// };
+// prevSlide() {
+// this.img[this.i].className = " ";
+// this.i--;
+// if (this.i <= 0) {
+// this.i = this.img.length - 1;
+// }
+// this.img[this.i].className = "active";
+// }
+// nextSlide() {
+// this.img[this.i].className = " ";
+// this.i++;
+// if (this.i >= 0) {
+// this.i = this.img.length - 1;
+// }
+// this.img[this.i].className = "active";
+// }
+// }
+/*создайте новый instance Carouse при вызове initialize*/
+// var myInitializedCarousel = Carousel.initialize({
+// elementToApply: '.carousel',
+// infinity: true,
+// });
+
+// let mySlider = new Carousel({prevBut:document.querySelector(".slider .buttons .prev"),
+// nextBut:document.querySelector(".slider .buttons .next"),
+// img:document.querySelectorAll(".slider .photos img"),
+// i: 0})
+
+
+var prevBut = document.querySelector(".slider .buttons .prev");
+var nextBut = document.querySelector(".slider .buttons .next");
+var firstBut = document.querySelector(".slider .buttons .first");
+var firImg = document.querySelector(".slider .photosList #el1");
+var secImg = document.querySelector(".slider .photosList #el2");
+var therImg = document.querySelector(".slider .photosList #el3");
+var fourImg = document.querySelector(".slider .photosList #el4");
+var fifImg = document.querySelector(".slider .photosList #el5");
+var sixImg = document.querySelector(".slider .photosList #el6");
+var sevImg = document.querySelector(".slider .photosList #el7");
+var eigImg = document.querySelector(".slider .photosList #el8");
+var img = document.querySelectorAll(".slider .photos img");
+var i = 0;
+
+
+
+prevBut.onclick = function() {
+ img[i].className = " ";
+ i--;
+ if (i < 0) {
+ i = img.length - 1;
+ }
+ img[i].className = "active";
+}
+nextBut.onclick = function() {
+ img[i].className = " ";
+ i++;
+ if (i > img.length - 1) {
+ i = 0;
+ }
+ img[i].className = "active";
+}
+firstBut.onclick = function() {
+ for (var i = 0; i < img.length; i++) {
+ if (i == 0) {
+ img[i].className = "active";
+ } else {
+ img[i].className = " ";
+ }
+ }
+}
+firImg.onclick = function() {
+ for (var i = 0; i < img.length; i++) {
+ if (i == 0) {
+ img[i].className = "active";
+ } else {
+ img[i].className = " ";
+ }
+ }
+}
+secImg.onclick = function() {
+ for (var i = 0; i < img.length; i++) {
+ if (i == 1) {
+ img[i].className = "active";
+ } else {
+ img[i].className = " ";
+ }
+ }
+}
+therImg.onclick = function() {
+ for (var i = 0; i < img.length; i++) {
+ if (i == 2) {
+ img[i].className = "active";
+ } else {
+ img[i].className = " ";
+ }
+ }
+}
+fourImg.onclick = function() {
+ for (var i = 0; i < img.length; i++) {
+ if (i == 3) {
+ img[i].className = "active";
+ } else {
+ img[i].className = " ";
+ }
+ }
+}
+fifImg.onclick = function() {
+ for (var i = 0; i < img.length; i++) {
+ if (i == 4) {
+ img[i].className = "active";
+ } else {
+ img[i].className = " ";
+ }
+ }
+}
+sixImg.onclick = function() {
+ for (var i = 0; i < img.length; i++) {
+ if (i == 5) {
+ img[i].className = "active";
+ } else {
+ img[i].className = " ";
+ }
+ }
+}
+sevImg.onclick = function() {
+ for (var i = 0; i < img.length; i++) {
+ if (i == 6) {
+ img[i].className = "active";
+ } else {
+ img[i].className = " ";
+ }
+ }
+}
+eigImg.onclick = function() {
+ for (var i = 0; i < img.length; i++) {
+ if (i == 7) {
+ img[i].className = "active";
+ } else {
+ img[i].className = " ";
+ }
+ }
+}
+
+/*
+* TASK 2
+* Сделайте класс, который будет иметь метод topStyle
+* метод topStyle принимает объект с CSS стилями и добавляет в
+* новый элемент с данными стилями
+*
+*
+* */
+
+class styleInitiate {
+
+ topStyle(newClass, newStyle){
+ document.body.head.style.innerHTML += `.${newClass}{${newStyle};}`
+ }
+}
+
+let elem = new styleInitiate()
+
+elem.topStyle('fetch', { "background-color":'blue'})
+/*
+*
+* 
+ 
+ 
+ 
+ 
+ 
+ 
+ 
+
+