3

html, javascript 키보드 이벤트

javascript로 키보드 이벤트를 제어할 수 있습니다. 우선 이벤트를 추가합니다. 1 2 document.addEventListener("keydown",keyPush); document.addEventListener("keyup",keyPull); cs 여기서 addEventListener의 첫번째 매개변수는 자신이 추가하고자하는 이벤트를 입력합니다. 키보드 이벤트에는 keydown, keyup 등이 있습니다. keydown의 경우 누르는 순간의 이벤트이고, keyup의 경우 눌렀다 놓는 순간의 이벤트입니다. 두번째 매개변수는 이벤트가 발생할때 실행되는 함수입니다. 이를 이용하여 키보드버튼의 움직임을 구현할 수 있습니다. 우선 4가지 방향을 설정하고 해당하는 keyCode가 눌렸을때 해당하는 연산을..

2021.02.27

크롬에서 코딩하기

웹 브라우저 크롬에도 소스코드를 편집할 수 있는 에디터기능이 내장되어있습니다. 우선 크롬을 키고 개발자도구(F12)를 엽니다. 상단바에서 source메뉴로 이동합니다. 좌측 (+)버튼을 누르거나 자신의 폴더를 드래그-드랍하면 폴더를 생성할 수 있습니다. 상단에 액세스를 요청하면 허용해주면 됩니다. 직접 폴더를 통해 파일을 만들어도 되고 크롬에서 파일을 만들 수도 있습니다. 파일에 html, css, js등 확장자명을 붙여주면 소스코드에 그에 맞는 색을 입혀줍니다. 파일을 오른쪽 클릭하면 웹 브라우저에 바로 결과를 볼 수 있습니다. 하단 console에서도 간단한 연산을 하거나 값을 도출 해볼 수 있어서 편합니다. 완벽한 개발환경을 갖추기 힘든 상황이거나 소스코드를 조금 수정해서 결과를 확인하고자 한다면 ..

2021.02.26

html 스크롤 멈추기 - css : overflow 속성

웹 문서가 길어지면 스크롤 바가 생기고 여러 가지 방법으로 스크롤을 할 수 있습니다. 마우스 휠, 스크롤바 드래그, 터치 패드, 키보드 방향키 등이 있습니다. 특정 상황에 스크롤이 움직이는 것을 막고 싶을 때 이를 제어할 수 있는 방법에 대해 알아봤습니다. css - overflow 속성을 활용하여 이를 제어할 수 있습니다. 스크롤에도 X축과 Y축이 있는데, 각각 overflow-x, overflow-Y에 해당합니다. overflow: visible; 스크롤 없이 모든 내용을 보여줍니다. The Web Real-Time Communications Working Group has published WebRTC 1.0: Real-Time Communication Between Browsers as a W3C..

2021.02.22