코린이 자바스크립트 질문 드립니다.

Question

안녕하세요. 취미로 프론트엔드를 공부하고 있는 직장인입니다. 노마드 코더의 바닐라 자바스크립트 무료 강의를 듣고 모멘텀 어플을 만든 후 추가하고 싶은 기능이 있어서 이것저것 시도하다가 답을 찾지 못해서 okky를 찾게 되었습니다.제가 넣고 싶은 기능은 저장된 이름을 변경할 수 있는 기능인데요. 기능을 실행하기 위해 아이콘을 클릭하면 두번째 이미지처럼 edit your name 이라는 문구가 들어있는 tooltip이 활성화되도록 구현하고 싶은데 아직 많이 부족해서 여기서 막혀버렸습니다. 자바스크립트 파일에 함수를 추가했는데 아이콘을 클릭해도 요지부동이네요. 스스로 해결하지 못해 부끄럽지만 조심스럽게 도움을 요청드립니다.ㅠㅠ -자바스크립트에 입력한 함수 -

more_vert

Edit your name

-해당부분 html - .material-symbols-outlined{ font-size: 50px; color: whitesmoke; text-align: center;} .material-symbols-outlined:hover { background-color: #363535; border-radius: 15px;} .toggleMenu{ position: relative; display: none;} .toggleMenu span{ display: inline-block; padding: 10px; color:whitesmoke; background-color: #363535; border-radius: 20px; width: 130px; text-align: center;} .toggleMenu::after { content: ""; position: absolute; width: 0; height: 0; border-style: solid; border-width: 10px 15px; top: 50%; margin-top: -10px; border-color: transparent #363535 transparent transparent; left: -25px;} .toggleMenu.active { display: inline-block;}-해당부분 csshttps://github.com/sinkuu77/ghibli-todo-list/blob/main/changename.jshttps://github.com/sinkuu77/ghibli-todo-list/blob/main/index.htmlhttps://github.com/sinkuu77/ghibli-todo-list/blob/main/style.css-해당부분 깃허브 주소 -

덤엔더머 · Answer

css 에.toggleMenu.active -> .activedisplay:.toggleMenu{position: relative;display: none;}->.toggleMenu{position: relative;}추가.hidden {display: none;}html 수정

Edit your name

코린이 자바스크립트 질문 드립니다.

1개의 답변

Q&A 목록