우당탕탕 개발 블로그 도전기

BootStrap과 moment를 이용해 해당 웹페이지에 2번째 container 태그 안에 아날로그 시계를 만들어 보겠다. 일단 웹페이지에 동작할 css 파일과 아날로그 시계에 동작할 css 파일, 시계를 동작시킬 js 파일을 따로 만든다. 외부 라이브러리를 이용한 간단한 기능 구현 게시판에 아날로그 시계 게시글을 참고해주길 바란다. 각각의 파일은 참고용으로 첨부해놨으니 본인 입맛에 맞게 바꿔서 사용하면 된다. 이제 두번 째 컨테이너에 시계를 출력하기 위해 간단한 html으로 뼈대를 제작해보자 아날로그 시계 이렇게 뼈대를 잡아주고 다시 html 페이지를 출력하면 짜잔! 해당 컨테이너 안에서 동작하는 시계가 완성이 된다. 해당 방법처럼 이미지 파일을 사용하지 않고 아날로그 시계를 구현할 방법도 있는데 이..

앞서 생년 월일을 선택하는 드롭다운에 이어 moment.js를 이용한 아날로그 시계 만들기를 해볼 예정이다. (moment는 jquery가 존재한다는 가정하에 동작하는 외부 라이브러리이다 'jquery 필수!) moment.js 다운로드 https://momentjs.com/ Moment.js | HomeFormat Dates moment().format('MMMM Do YYYY, h:mm:ss a'); moment().format('dddd'); moment().format("MMM Do YY"); moment().format('YYYY [escaped] YYYY'); moment().format(); Relative Time moment("20111031", "YYYYMMDD").fromNow(); ..

외부 라이브러리 moment는 기본적으로 jqeury가 존재한다는 전제하에 동작하는 라이브러리이다. (Jquery 다운로드 링크는 잡다한 정리노트의 'Jqery 끄적노트' 게시글을 참고해주기 바란다.) moment.js 다운로드 https://momentjs.com/ Moment.js | Home Format Dates moment().format('MMMM Do YYYY, h:mm:ss a'); moment().format('dddd'); moment().format("MMM Do YY"); moment().format('YYYY [escaped] YYYY'); moment().format(); Relative Time moment("20111031", "YYYYMMDD").fromNow(); mome..