🥬 상추의 공간

  • Github
  • 방명록
  • tistory 홈
  • 블로그 관리
  • 글쓰기
프로필사진

상추의 공간

상추의 자아 성찰, 기록 끄적끄적 공간

  • 분류 전체보기 (109)
    • JavaScript (33)
    • React (14)
    • HTML & CSS (7)
    • CS (9)
      • Data structure & Algorithom (7)
      • Network (2)
    • Git (14)
    • Java (11)
    • Tool, Service, Library, Etc.. (4)
    • 코딩테스트 문제풀이 (0)
    • 문제 해결 & 구현 기록 (9)
    • 회고 & 생각 (8)

방문자수Total

  • Today :
  • Yesterday :

구현

javascript | 다중토글 구현하기 - forEach, toggle

See the Pen 다중토글 by sanghee01 (@sanghee01) on CodePen.forEach를 이용해 모든 토글들에게 기능을 적용시킨다.(매개변수 이름은 tog라 지었다)각 토글(tog)이 click 이벤트를 받을 시,만약 현재 내용이 안보인다면 내용이 보이도록 show class ( display:block )를 넣고내용이 보인다면 안보이도록 show class를 제거한다. (default는 css에서 display:none처리를 했다)이 기능은 element.toggle( )를 이용하였다.  cont같은 경우 tog.nextElementSibling이라 작성하였는데,클릭한 tog의 cont 값을 가져오고 싶어서 이렇게 작성하였다.  Element.classList - Web API..

JavaScript 2022.01.20

javascript | 모달창 구현하기 - css display 조작

See the Pen modal by sanghee01 (@sanghee01) on CodePen.  display: none 속성을 이용한다. open 버튼을 누르면 modal 에 'display: none' class를 없애 모달창이 보이도록 하고close 버튼과 배경을 누르면 'display: none' class를 넣어 모달창이 안보이도록 한다.

JavaScript 2022.01.11
이전
1
다음
더보기
Github LinkedIn

Copyright © Kakao Corp. All rights reserved.

상추의 공간
  • github

티스토리툴바