udemyClone/script.js at main · Kaylahray/udemyClone · GitHub

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
136
137
138
139
140
141
142
143
const navToggle = document.getElementById("nav-toggle");
const navClose = document.getElementById("nav-close");
const backdrop = document.getElementById("back-drop");
const courseContent = document.getElementsByClassName("course_content");
const courseHeader = document.querySelectorAll(".course_header");
const Feedback = document.getElementById("feed");
const Move = document.getElementById("move");
const tabs = document.querySelectorAll("[data-target]");
const tabContent = document.querySelectorAll("[data-content]");

if (navToggle) {
  navToggle.addEventListener("click", () => {
    backdrop.classList.add("show");
  });
}
if (navClose) {
  navClose.addEventListener("click", () => {
    backdrop.classList.remove("show");
  });
}

function toggleCourse() {
  let itemClass = this.parentNode.className;
  for (let i = 0; i < courseContent.length; i++) {
    courseContent[i].className = "course_content courses_close";
  }
  if (itemClass === "course_content courses_close") {
    this.parentNode.className = "course_content courses_open";
  }
}

courseHeader.forEach((ele) => {
  ele.addEventListener("click", toggleCourse);
});

const Scroll = () => {
  const right = document.getElementById("feed");
  right.scrollLeft = right.scrollLeft + 1000;
};

const ScrollAlt = () => {
  const right = document.getElementById("feed");
  right.scrollLeft = right.scrollLeft - 1000;
};

const ScrollStu = () => {
  const Student = document.getElementById("stu");
  Student.scrollLeft = Student.scrollLeft + 500;
};

const ScrollStuAlt = () => {
  const Student = document.getElementById("stu");
  Student.scrollLeft = Student.scrollLeft - 500;
};

const ScrollCta = () => {
  const card = document.getElementById("cardd");
  card.scrollLeft = card.scrollLeft + 2000;
};

const ScrollCtaAlt = () => {
  const card = document.getElementById("cardd");
  card.scrollLeft = card.scrollLeft - 2000;
};

const ScrollCou = () => {
  const cou = document.getElementById("cou");
  cou.scrollLeft = cou.scrollLeft + 2000;
};

const ScrollCouAlt = () => {
  const cou = document.getElementById("cou");
  cou.scrollLeft = cou.scrollLeft - 2000;
};

const ScrollCou2 = () => {
  const cou = document.getElementById("cou2");
  cou.scrollLeft = cou.scrollLeft + 2000;
};

const ScrollCouAlt2 = () => {
  const cou = document.getElementById("cou2");
  cou.scrollLeft = cou.scrollLeft - 2000;
};

const ScrollCou3 = () => {
  const cou = document.getElementById("cou3");
  cou.scrollLeft = cou.scrollLeft + 2000;
};
const ScrollCouAlt3 = () => {
  const cou = document.getElementById("cou3");
  cou.scrollLeft = cou.scrollLeft - 2000;
};

const ScrollCou4 = () => {
  const cou = document.getElementById("cou4");
  cou.scrollLeft = cou.scrollLeft + 2000;
};
const ScrollCouAlt4 = () => {
  const cou = document.getElementById("cou4");
  cou.scrollLeft = cou.scrollLeft - 2000;
};

const ScrollCou5 = () => {
  const cou = document.getElementById("cou5");
  cou.scrollLeft = cou.scrollLeft + 2000;
};
const ScrollCouAlt5 = () => {
  const cou = document.getElementById("cou5");
  cou.scrollLeft = cou.scrollLeft - 2000;
};

const ScrollCou6 = () => {
  const cou = document.getElementById("cou6");
  cou.scrollLeft = cou.scrollLeft + 2000;
};
const ScrollCouAlt6 = () => {
  const cou = document.getElementById("cou6");
  cou.scrollLeft = cou.scrollLeft - 2000;
};

const ScrollCou7 = () => {
  const cou = document.getElementById("cou7");
  cou.scrollLeft = cou.scrollLeft + 2000;
};
const ScrollCouAlt7 = () => {
  const cou = document.getElementById("cou7");
  cou.scrollLeft = cou.scrollLeft - 2000;
};

tabs.forEach((tab) => {
  tab.addEventListener("click", () => {
    let target = document.querySelector(tab.dataset.target);
    tabContent.forEach((tabContent) => {
      tabContent.classList.remove("course_active");
    });
    target.classList.add("course_active");
    tabs.forEach((tabb) => {
      tabb.classList.remove("course_active");
    });
    tab.classList.add("course_active");
  });
});