GPD2021

뚝딱 만들면 될 줄 알았는데 생각보다 어렵다. 메인페이지를 헤더 메인 풋터로 나누고 메인을 5개의 섹션으로 나눴다. 일단 큰 그림은 그렸으니까 헤더나 풋터, 각 섹션에 들어갈 하위 요소들은 만들면서 생각하자는 마음으로 임했다. 제일 만들기 쉬운 풋터나 헤더를 만들고 css를 입히고, 다음 섹션으로 넘어갔다. 그런데 이렇게 하다보니 각 섹션을 만들 때마다 구조의 일관성이 없이 생각나는대로 만들게 되서 필요없는 div를 계속 추가로 만들게 된다. 싹 엎고 다시해야겠다. 우선 html을 전부 작성한 다음에 css로 넘어가야겠다.

var: 구식. let : 변수를 선언할 때 사용, 사용한 위치에 따라 사용 범위가 달라짐. const: 변하지 않는 값, 상수를 선언할 때 사용. var는 과거의 문법이니까 앞으로는 let과 const를 사용.

숫자 카운터. 0부터 99까지, 숫자가 증가되는 모습이 화면에 출력. 99

@keyframes 을 추가로 만들기 싫어서 이미 만들어 놓은 거에 animation-direction: reverse; 썼다가 헤멨다. 그냥 @keyframes 추가해주자. javascript는 이상이 없는데 여기서 문제를 찾으려다가 시간을 많이 썼다. 개발자 도구 콘솔창에 문제가 없다면 요소창에 가서 css를 살펴서 문제를 발견할 수도 있다. 그냥 @keyframes 추가해주자. 그런데 여기서 var sIndex=0; autoslide=setInterval(slider,2000); function slider(){ li=document.querySelectorAll('.box> li'); onNum = sIndex+1; if(onNum==li.length){ onNum=0;} for(i=0; i

이 책을 산 건 2월 중순, 블록체인에 대해 공부하기로 했으니 배경지식을 쌓자는 마음으로 구매했는데 어려워서 읽다가 중간에 쉬고 최근에 겨우 다 읽었다. 읽긴 읽었는데 내가 잘 읽은 건지 모르겠다;; 1부에서는 블록체인에 대한 소개, 7가지 원칙인가 그걸 계속 설명한다. 2부는 블록체인이 적용될 수 있는 다양한 분야에 대해 소개한다. 나는 이 부분을 그나마 재밌게 읽었다. 3부에서는 블록체인이 가지고 있는 불안요인에 대해 다룬다. 처음에는 모르는 단어가 많이 나와서 그거 다 찾으면서 읽는 게 정말 스트레스였다. 계속 단어 찾아보고 이해 안 되는 부분 몇 번씩 읽었는데 이렇게 읽다가 1년 내내 읽을 것 같아서 어느 순간부터 무슨 말인지 몰라도 대충 그렇구나. 하고 넘어가면서 읽었다. 그런데 읽다 보면 '아..

#banner>ul>li.fadein{ animation: fadein 3s; } @keyframes fadein{ from{ opacity:0; } to{ opacity: 1; } } animation 다수의 스타일을 전환하는 애니메이션을 적용. animation 속성 /* @keyframes duration | timing-function | delay | iteration-count | direction | fill-mode | play-state | name */ animation: 3s ease-in 1s 2 reverse both paused slidein; /* @keyframes duration | timing-function | delay | name */ animation: 3s lin..

저번에 만든 이미지 슬라이드에서 버튼으로 setinterval을 켜고 끌 수 있게 하는 기능을 추가해봤다. 버튼을 만들고 isStop = true; function onoffInterval(){ if(isStop==true){ isStop=false; x=setInterval(changelist,500); } else{ isStop=true; clearInterval(x); } } boolean타입 변수와 함수를 만들었다. 최초 isStop은 true다. 버튼을 누르면 onoffInterval 함수가 실행된다. onoffInterval은 제일 먼저 if-else문을 통해 isStop이 true인지 false인지 검사한다. 검사 결과 isStop은 true이기 때문에 if문 안의 내용이 실행된다. 우선 실..

https://poiemaweb.com/js-array