JavaScript 3 썸네일형 리스트형 구현 2023.06.13 게시물 Table Of Contents 자동 목차 만들기 개요현재 블로그 게시글 페이지처럼 글 구조를 보여주는 목차를 페이지 한편에 띄우려 한다.이름하야 Table of Contents, 목차다. 보통 한 쪽에 글의 소제목을 나열하고, 현재 읽고 있는 부분이 어디인지 알려주거나 클릭했을 때 해당 파트로 이동할 수 있는 기능을 말한다.페이지 상의 글 구조를 분석 후 리스트를 만들어 원하는 위치에 꽂아주려 한다. 구현 사항글의 구조를 분석하고 리스트로 만든다해당 제목을 클릭했을 때 해당 위치로 이동한다 구현 방법페이지에서 DOM을 분석하여 글의 리스트를 추출하고, 이것을 조합하여 중첩된 ol엘리먼트로 만든다만든 엘리먼트를 원하는 위치에 꽂아준다페이지에 알맞게 스타일링을 해준다이번 글에서는 페이지에서 리스트 추출해서 화면에 붙이는 것까지만 작성할 예정이다. 사실 작.. 구현 2022.07.26 오늘 하루 보지 않기 팝업 만들기 오늘 하루는 보지 않기 팝업을 구현합니다.쿠키와 로컬 스토리지가 어떤 것인지 간단하게 알아보고두가지 방법으로 구현하는 방법을 함께 알아봐요! 구현 사항 및 방법 정리어떤 걸 구현해야 할까?사용자가 그냥 닫기를 눌렀는지, 오늘 하루 보지 않기 버튼을 눌렀는지 확인팝업이 다시 보이는 시각 계산하여 저장저장한 값을 읽고 눌렀다면 보이게, 보이지 않게 스타일 변경버튼에 이벤트 거는 설명은 생략. 오늘 중요한 건 사용자가 오늘하루 보지 않기 버튼을 눌렀는지, 안 눌렀는지 확인하는 것이다.적당한 저장 장소 찾기HTTP, 보통 볼 수 있는 웹 페이지는 상태를 저장하지 않는 stateless 프로토콜이다. 주소를 입력해 페이지를 접속하면 서버는 언제나 동일하게 똑같은 html 정보를 브라우저로 보내 준다.다시 말하자면.. 구현 2021.12.17 swiperjs 슬라이더 기본 사용법 알아보기 swiperjs 웹사이트에 기본적으로 들어가는 슬라이더. 흔하게 쓰이는 기능인만큼 슬라이더 플러그인도 엄청나게 많다. 오늘은 그 중에서 swiperjs를 소개 하려 한다. 실제로 사용하면서 초보 시절에 헷갈렸던 부분이나 최근 새로 알게 된 팁들까지 최대한 자세하게 작성했다. swiperjs 장점 많고 많은 슬라이더 중에서 swiper를 사용하게 된 이유는 아래와 같다. 많은 예시 및 자세한 api 안내글 → 혼자서 배우기 좋음 사용하는 사람 많음 → 자료 찾기 쉬움 다양한 기능 지원 → 커스텀하여 사용하기 편리함 vue, reactjs 프레임워크용 슬라이더 지원 → 한 번 배워두면 여기저기 사용하기 좋음 자, 이렇게 장점이 많은 슬라이더, 어떻게 쓰는 건지 한번 알아나 봅시다. 01. GET STARTE.. 이전 1 다음