practice 2

js/common.js

@@ -0,0 +1,27 @@
+$(document).ready(function () {
+
+    $(".call").click(function (e) {
+        e.preventDefault();
+        $(".callback.popup").css("display", "block");
+    });
+    $(".close").click(function (e) {
+        e.preventDefault();
+        $(".popup").css("display", "none");
+    });
+
+    var scroll = function (e) {
+        var id = "#" + $(e.target).attr("data-to");
+        var mnuH = $('header .top-mnu').height();
+        var top = $(id).offset().top - mnuH;
+        $('body,html').animate({scrollTop: top}, 1500);
+    };
+
+    var increase = function (e) {
+        $(this).find('.hover-img').toggleClass("big");
+    };
+
+    $('.top-mnu nav').on('click', scroll);
+    $('#contact-us').on('click', scroll);
+    $("#up").on('click', scroll);
+    $('.hover-block').on('mouseenter mouseleave', increase);
+});

js/sliders.js

@@ -0,0 +1,93 @@
+var sliderMain = document.getElementsByClassName("slider")[0];
+var divs = sliderMain.getElementsByClassName("slide-menu");
+var next = document.getElementById("next");
+var prev = document.getElementById("prev");
+var timer = setInterval(slider, 3000);
+var flagForT = true;
+
+function startTime() {
+    timer = setInterval(slider, 3000);
+    flagForT = true
+}
+function pauseTimer() {
+    if (flagForT) {
+        clearInterval(timer);
+        setTimeout(startTime, 5000);
+        flagForT = false;
+    }
+}
+
+next.onclick = function () {
+    pauseTimer();
+    return slider();
+};
+
+prev.onclick = function () {
+    pauseTimer();
+    return slider(true);
+};
+// default direction to right. If you want to change on left you can write true in variable "changeOfDirection"
+function slider(changeOfDirection) {
+    var active = sliderMain.getElementsByClassName("active");
+    var nextElem;
+    if (changeOfDirection) {
+        nextElem = active[0].previousElementSibling;
+    } else {
+        nextElem = active[0].nextElementSibling;
+    }
+    var indexOf = [].indexOf;
+
+    if (nextElem == null || !nextElem.classList.contains("slide-menu")) {
+        nextElem = divs[divs.length - 1 - indexOf.call(divs, active[0])];
+    }
+    active[0].classList.remove("active");
+    nextElem.classList.add("active");
+}
+
+/*Second slider for partner*/
+var sliderPartner = document.getElementsByClassName("multtiple-slider")[0];
+var divsPartner = sliderPartner.getElementsByClassName("slide-item");
+var timer2 = setInterval(nextPartner, 3000);
+
+function nextPartner() {
+    var activElements = sliderPartner.getElementsByClassName("acitve");
+    var lastElemen = divsPartner[divsPartner.length - 1];
+
+    activElements[activElements.length - 1].classList.remove("acitve");
+    sliderPartner.removeChild(lastElemen);
+    lastElemen.classList.add("acitve");
+    sliderPartner.insertBefore(lastElemen, activElements[0]);
+}
+
+var activDiv = document.getElementsByClassName("comment")[0];
+var divs_target = document.getElementsByClassName("comment");
+
+function createBtn(i) {
+    var btn = document.createElement("input");
+    btn.setAttribute("type", "button");
+    btn.setAttribute("name", i);
+    btn.className = 'ctrl';
+
+    return btn;
+}
+
+function countDiv(idNameWhen) {
+    var target_div = document.getElementsByClassName(idNameWhen)[0];
+    for (var i = 0; i < divs_target.length; i++) {
+        var btn = createBtn(i);
+        target_div.appendChild(btn);
+        btn.addEventListener("click", normal);
+
+    }
+
+}
+
+function normal(e) {
+    var div = divs_target[e.target.name];
+    activDiv.classList.remove("active");
+    div.classList.add("active");
+    activDiv = div;
+};
+
+
+countDiv("points-ctrl");

js/team.js

@@ -0,0 +1,28 @@
+var quater = document.getElementsByClassName("team-pic");
+var triangle_team = document.getElementsByClassName("point")[0].getElementsByClassName("quater");
+var team_description = document.getElementsByClassName("single-team");
+
+var active_triangle = triangle_team[0];
+var active_description = team_description[0];
+
+function addListTeam() {
+    for (var i = 0; i < quater.length; i++) {
+        quater[i].setAttribute("data", i);
+        quater[i].addEventListener("click", change_member);
+    }
+}
+
+function change_member(e) {
+    var value = this.getAttribute("data");
+
+    active_triangle.classList.remove("active");
+    active_description.classList.remove("active");
+
+    active_triangle = triangle_team[value];
+    active_description = team_description[value];
+
+    active_triangle.classList.add("active");
+    active_description.classList.add("active");
+}
+
+addListTeam();