-
Notifications
You must be signed in to change notification settings - Fork 0
/
script.js
59 lines (53 loc) · 1.77 KB
/
script.js
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
(function(){
const spanEl = document.querySelector("main h2 span");
const txtArr = ['10101 홍길동', '10102 김길동'];
let index = 0;
let currentTxt = txtArr[index].split("");
function writeTxt(){
spanEl.textContent += currentTxt.shift();
if(currentTxt.length !== 0){
setTimeout(writeTxt, Math.floor(Math.random() * 100));
}else{
currentTxt = spanEl.textContent.split("");
setTimeout(deleteTxt, 3000);
}
}
function deleteTxt(){
currentTxt.pop();
spanEl.textContent = currentTxt.join("");
if(currentTxt.length !== 0){
setTimeout(deleteTxt, Math.floor(Math.random()*100));
}else{
index = (index + 1) % txtArr.length;
currentTxt = txtArr[index].split("");
console.log(currentTxt);
writeTxt();
}
}
writeTxt();
})();
const headerEl = document.querySelector("header");
window.addEventListener('scroll', function(){
requestAnimationFrame(scrollCheck);
});
function scrollCheck(){
let browerScrollY = window.scrollY ? window.scrollY :window.pageYOffset;
if(browerScrollY > 0){
headerEl.classList.add("active");
}else{
headerEl.classList.remove("active");
}
}
const animationMove = function(selector){
const targetEl = document.querySelector(selector);
const browserScrollY = window.pageYOffset;
const targetScrollY = targetEl.getBoundingClientRect().top + browserScrollY
window.scrollTo({top: targetScrollY, behavior:'smooth'});
}
const scrollMoveEl = document.querySelectorAll("[data-animation-scroll='true']");
for(let i = 0; i < scrollMoveEl.length; i++){
scrollMoveEl[i].addEventListener('click', function(e){
const target = this.dataset.target;
animationMove(target);
});
}