목록html (3)

umilove98의 블로그

페이지 맨 위로 스크롤 하고 싶다 ScrollToPlugin

웹 페이지를 보다보면 맨 위로 스크롤 해주는 버튼이 아래쪽에 위치해 있는 것을 볼 수 있다. 이를 편하게 구현할 수 있게 해 주는 라이브러리 gsap의 ScrollToPlugin이 있다. gsap - Libraries - cdnjs - The #1 free and open source CDN built to make life easier for developers gsap - Libraries - cdnjs - The #1 free and open source CDN built to make life easier for developers GSAP is a JavaScript library for building high-performance animations that work in **every** ..
language,framework,library/Javascript 2022. 10. 21. 23:23
HTML 클래스 속성 작명 BEM

BEM이란 Block Element Modifier의 약칭으로 html 의 요소에 클래스 속성을 부여할 때 그 이름을 지어주는 규칙을 말한다. 요소__일부분 (underscore 2개 사용) 요소--상태 (hyphen 2개 사용) 형태가 있는데 예를 들어 이러한 형태의 코드가 작성되어 있다고 할 때, container 라는 클래스를 가진 요소의 자식으로 name(1번), item 클래스를 가진 요소들이 있고 item 클래스의 요소는 다시 name(2번)이라는 클래스를 가진 자식 요소가 있다. css에서 container 의 자식요소인 name(1번)을 지정하고자 할 때 .container .name{ } 위와 같이 사용하는 경우가 많은데 이런 경우 item의 자식 요소인 name(2번) 까지 지정되어 불..
language,framework,library/HTML 2022. 10. 12. 12:35
defer 전체 HTML문서를 전부 읽은 후 자바스크립트를 동작시키고 싶다

다음과 같이 작성된 HTML 문서가 있다. hello main.js 에 이런 내용을 입력해 보았다. let boxEl = document.querySelector('.box'); console.log(boxEl); querySelector를 통해 문서 내부의 box클래스를 가진 요소를 가져와 boxEl 이라는 함수 내부에 저장 후 그 내용을 콘솔에 출력하는 코드이다. 해당 요소의 정보를 확인하기 위해 실행시켜보았는데.. 의도한 것과 다르게 null값이 콘솔에 출력되었다. 기본적으로 브라우저가 HTML문서를 위에서 아래로 읽어가며 실행하기 때문에 이런 현상이 발생하게 되었는데 자바스크립트를 불러와 동작시키는 해당 코드는 문서의 윗 부분인 head 부분에 작성되어 있고 hello 자바스크립트 문서에서 찾고 ..
language,framework,library/Javascript 2022. 10. 10. 23:28
이전 Prev 1 Next 다음