일 | 월 | 화 | 수 | 목 | 금 | 토 |
---|---|---|---|---|---|---|
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 |
- Crawling
- HTML
- DATABASE
- OOAD
- Express
- TypeScript
- MongoDB
- postman
- OS
- Scheduling
- macos
- node.js
- mongoose
- Network
- ubuntu
- wireshark
- sequelize
- Kotlin
- Android
- AWS
- algorithm
- css
- docker
- S3
- typeorm
- mysql
- React
- linux
- Util
- python
- Today
- Total
목록
반응형
javascript (2)
Seongwon Lim
서론 여러 웹페이지를 보면 우측 하단에 맨 위로가기 버튼이 표시되어 있는 페이지들이 많이 존재한다. 이번 글에서는 자바스크립트를 통해 맨 위로가기 기능을 구현하는 방법을 간단하게 알아보고자 한다. 구현 방법 먼저 HTML 코드는 다음과 같은 예시로 구성했다. 위로 다음으로 CSS는 다음과 같이 구성했다. HTML, CSS 코드는 단지 예제를 보여주기 위해 임의로 만든 레이이아웃이며 최상단으로 이동하는 기능만을 원하는 분들은 위에 코드를 참고할 필요 없이 아래의 자바스크립트 코드부터 사용하면 된다. 자바스크립트를 통해서 구현하는 방법은 다음과 같다. let rollUpBtn = document.querySelector('#rollUp'); const scroll = () => { if (window.scr..
서론 여태까지 진행한 예제들은 타입스크립트 기반으로 개발 환경을 구성하고 ts-node 모듈을 이용하여 직접 ts파일을 빌드하여 실행했다. 이번에는 ts파일을 직접 실행하는 것이 아니라 ts 파일을 컴파일하여 생성된 js파일을 가지고 실행하는 것을 알아보고자 한다. 실제 프로젝트에서 런타임을 할 때에는 대부분의 경우가 javascript 파일을 실행하기 때문이다. tsconfig.json 수정하기 { "compilerOptions": { "lib": [ "es5", "es6" ], "target": "es5", "module": "commonjs", "moduleResolution": "node", "outDir": "./build", // 이전에 정의 안했다면 정의하기 "rootDir": "./src"..