TRstory

- 기본 전역 사용 - 동적 스크립트 로드후 사용

현재 년도

new IntersectionObserver(callback[, options]);Intersection Observer API 의 IntersectionObserver 인터페이스는 대상 요소와 상위 요소, 또는 대상 요소와 최상위 문서의 뷰포트 가 서로 교차하는 영역이 달라지는 경우 이를 비동기적으로 감지할 수 있는 수단을 제공합니다.DOC : https://developer.mozilla.org/ko/docs/Web/API/IntersectionObserver 메서드설명.observe(targetElement)루트 내에서의 가시성 변화를 감지할 element입니다. 루트 요소의 자손이어야 합니다. 루트가 현재 문서의 뷰포트일 경우 이 요소도 문서 내에 위치해야 합니다.반환값 : undefined.di..

CDN : https://cdnjs.com/ jQuery : https://cdn.jsdelivr.net/npm/jquery@3.6.4/dist/jquery.min.jsgsap :    https://cdn.jsdelivr.net/npm/gsap@3.12.5/dist/gsap.min.jsScrollTrigger : https://cdnjs.cloudflare.com/ajax/libs/gsap/3.12.5/ScrollTrigger.min.js

100/1초 시간을 (시:분:초:100/1초) 변환 // total => 100 / 초 funciton HMSsm(total){ let totalS = Math.floor(total / 100); // totle (초) let timeH = Math.floor(totalS / 3600); // 1시간 3600초 (시) let timeM = Math.floor(totalS % 3600 / 60); // 나머지 를 / 60 몫 (분) let timeS = Math.floor(totalS % 60); // 나머지 (초) let timeMs = (total % 100); // 100/1 초 timeH = String(timeH).padStart(2,"0"); timeM = String(timeM).padStar..

CSS 선언 인라인(inline) 방식 html 에서 적용 ... 내장(internal) 방식 html 에서 style 태그로 적용 링크(external) 방식 html 에서 적용 @import(inport) 방식 css 에서 적용 @import url("./css/style.css");

인터페이스 Element의 메서드는 호출된 요소가 사용자에게 표시 scrollIntoView()되도록 요소의 상위 컨테이너를 스크롤합니다. element.scrollIntoView(true) doc : https://developer.mozilla.org/en-US/docs/Web/API/Element/scrollIntoView- element : 스크롤 타겟- element.scrollIntoView(true) : 스크롤 타겟의 포커스 이동에 따라 부모 스크롤 이동. (상단 기준)- element.scrollIntoView(false) : 스크롤 타겟의 포커스 이동에 따라 부모 스크롤 이동. (하단단 기준)

CommonJS(CJS) vs ECMAScript Modules(ESM) node js 의 모듈 시스템 - es5 의 모듈 시스템 (CJS) 확장자를 "*.cjs"로 사용하면 (CJS)로인식 - es6 의 모듈 시스템(ESM) 확장자를 "*.mjs"로 사용하면 (ESM)로 인식 or - package.json 에서 {type:"commonjs"} 선언시 (CJS)로 인식 - package.json 에서 {type:"module"} 선언시 (ESM)로 인식 or - 기본적으로 "*.js" 파일을 사용하지만 위처럼 강제할 수 있음. CommonJS - cjs 모듈 확장자(.cjs) - moduleES5CommonJS.cjs const sum = ($a, $b) => { return ($a+$b); } con..

vue3 CLI 초기 세팅 node.js (v14.13.0), npm (v8.11.0) vue CLI 기본 설치 초기 세팅 (설치 i, 삭제 r) npm 설치 (1,2 버젼 'vue-cli'), (3 버젼 '@vue/cli') ~~npm i -g vue-cli~~ npm i -g @vue/cli 업데이트 npm update -g @vue/cli yarn 설치 npm install -g yarn yarn add @vue/cli 업데이트 yarn global upgrade --latest @vue/cli vue, vue cli 설치 npm install -g @vue/cli 실행 개발 : npm run dev 배포 : npm run build 프로젝트 생성 vue create [..

# 넘버링 - 결과 HTML 삽입 미리보기할 수 없는 소스 - 소스