본문 바로가기
조회 수 65 추천 수 0 댓글 8
?

단축키

Prev이전 문서

Next다음 문서

크게 작게 위로 아래로 댓글로 가기 인쇄
?

단축키

Prev이전 문서

Next다음 문서

크게 작게 위로 아래로 댓글로 가기 인쇄
Extra Form

대략 어떤걸 숨겨야 할지는 알겠는데 문제는 공지 접기 버튼을 누르면 공지 펼치기로 바뀌는 부분과 새로고침을 해도 공지 접기나 펼치기 상태가 게시판 한정으로 반영이 되어야함. 이걸 보르겠음.

Who's 뉴리대장

profile

아이마스 좋아하는 코더.

목록
  • profile
    작성자 뉴리대장Best 2022.07.13 15:40

    감사합니다. 제이쿼리 없는 바닐라 js네요. 해당 코드 참조해서 구현해 보도록 하겠습니다.

  • ?
    갓수가되고싶따Best 2022.07.13 15:24
    <!DOCTYPE html>
    <html>
    <head>
    <meta charset="utf-8"/>
    <title>제목</title>
    </head>
    </body>
    <style>
    #toc-content {
    display: none;
    }
    #toc-toggle {
    cursor: pointer;
    color: #2962ff;
    }
    #toc-toggle:hover {
    text-decoration: underline;
    }
    </style>

    목차 [<span id="toc-toggle" onclick="openCloseToc()">보이기</span>]
    <ol id="toc-content">
    <li>HTML</li>
    <li>CSS</li>
    <li>JavaScript</li>
    </ol>

    <script>
    var view_key=localStorage.getItem('view_key');
    console.log(view_key);
    if(view_key=="true"){
    document.getElementById('toc-content').style.display = 'none';
    document.getElementById('toc-toggle').textContent = '보이기';
    }else if(view_key=="false"){
    document.getElementById('toc-content').style.display = 'block';
    document.getElementById('toc-toggle').textContent = '숨기기';
    }
    function openCloseToc() {
    if(document.getElementById('toc-content').style.display === 'block') {
    document.getElementById('toc-content').style.display = 'none';
    document.getElementById('toc-toggle').textContent = '보이기';
    localStorage.setItem('view_key',true);
    } else {
    document.getElementById('toc-content').style.display = 'block';
    document.getElementById('toc-toggle').textContent = '숨기기';
    localStorage.setItem('view_key',false);
    }
    }
    </script>
    </body>
    </html>

    일단 만들어봣는데 위 소스 그대로 html 파일로 만들어서 테스트 해보시면 될듯
    생각하시는게 다를거 같아서 틀릴수도있을거같은데 개인적으로는 공부가 되서 잘 써먹을듯요
  • ?
    갓수가되고싶따 2022.07.13 14:50

    https://joshua-dev-story.blogspot.com/2020/09/javascript-collapse.html

    이 블로그 참고해보시는건 어떨지?

    고정은 css style 쪽에서 고정시키거나 따로 값을 가지고 있게해서 적용해야할거같은데 그건 좀더 찾아봐야할듯요

  • ?
    갓수가되고싶따 2022.07.13 15:10
    css 고정은 localstorage 라는게 잇어서 찾아보고있는데 얼추 정리되면 예시코드 한번 드릴수있을듯요
  • profile
    작성자 뉴리대장 2022.07.13 15:14
    일단 공지글 자체는 tr.notice만 날리면 됨. 그 날리는 버튼을 어떻게 만드는지가 문제임.
  • ?
    갓수가되고싶따 2022.07.13 15:24
    <!DOCTYPE html>
    <html>
    <head>
    <meta charset="utf-8"/>
    <title>제목</title>
    </head>
    </body>
    <style>
    #toc-content {
    display: none;
    }
    #toc-toggle {
    cursor: pointer;
    color: #2962ff;
    }
    #toc-toggle:hover {
    text-decoration: underline;
    }
    </style>

    목차 [<span id="toc-toggle" onclick="openCloseToc()">보이기</span>]
    <ol id="toc-content">
    <li>HTML</li>
    <li>CSS</li>
    <li>JavaScript</li>
    </ol>

    <script>
    var view_key=localStorage.getItem('view_key');
    console.log(view_key);
    if(view_key=="true"){
    document.getElementById('toc-content').style.display = 'none';
    document.getElementById('toc-toggle').textContent = '보이기';
    }else if(view_key=="false"){
    document.getElementById('toc-content').style.display = 'block';
    document.getElementById('toc-toggle').textContent = '숨기기';
    }
    function openCloseToc() {
    if(document.getElementById('toc-content').style.display === 'block') {
    document.getElementById('toc-content').style.display = 'none';
    document.getElementById('toc-toggle').textContent = '보이기';
    localStorage.setItem('view_key',true);
    } else {
    document.getElementById('toc-content').style.display = 'block';
    document.getElementById('toc-toggle').textContent = '숨기기';
    localStorage.setItem('view_key',false);
    }
    }
    </script>
    </body>
    </html>

    일단 만들어봣는데 위 소스 그대로 html 파일로 만들어서 테스트 해보시면 될듯
    생각하시는게 다를거 같아서 틀릴수도있을거같은데 개인적으로는 공부가 되서 잘 써먹을듯요
  • ?
    갓수가되고싶따 2022.07.13 15:29
    html 코드 이대로 올려도 괜찮은지는 모르겟는데 문제가 된다면 얘기해주시면 바로 삭제하겟습니다~
  • profile
    작성자 뉴리대장 2022.07.13 15:40

    감사합니다. 제이쿼리 없는 바닐라 js네요. 해당 코드 참조해서 구현해 보도록 하겠습니다.

  • ?
    갓수가되고싶따 2022.07.13 15:42
    화이팅입니다 ^^
  • profile
    일립시S 2022.07.13 18:21

    이거 내가 파일 목록 접기 스크립트 만들어놓은 거 쿠키랑 섞어 쓰면 될 텐데


유머/자유 게시판

유머를 포함하여 국내 정치 이외의 이야기를 자유롭게 할 수 있는 게시판 입니다

  1. No Image notice by 뉴리대장 2023/12/18 by 뉴리대장
    Views 865  Likes 5

    우리 사이트는 스퀘어발 난민을 환영합니다 0

  2. 사이트 이용 규칙(2024.02.23. 수정) 17

  3. 수위가 있는 게시물에 대해 3

  4. 유머/자유 게시판 이용 안내 및 규칙 7

  5. 세상이 떠내려갈것처럼 비가 내리네 2

  6. 유희왕 ) 용사 나왔다길래 구경해봣는데 0

  7. @) 4명중 3명 성공했다 0

  8. @) 와 줄리아 떴다 ㅋㅋㅋㅋㅋㅋㅋㅋㅋ 0

  9. 말딸)하루우라라와 히소카 트레이너야!(2).manhwa 0

  10. @) 밀리는 이제 다시 우선순위 하락이다 0

  11. 웹 개발 같은 웹쪽에 관심있는 사람이 흥미로운 확장기능 1

  12. 닭가슴살을 대량으로 시킴. 8

  13. 웹개발은 너무 어려움 ㅠㅠ 8

  14. ㅅㅂ 자가진단 2줄 나왔네 3

  15. 코로나로 출근안하는거는 별론데 1

  16. 기억의 왜곡 1

  17. 갤러리 섬네일 크기 개선함 0

  18. 혹시 JS 잘하는 사람 공지 어떻게 숨기는지 좀 도와주셈 8

  19. 가끔 사람들의 상상력은 대단한 것 같아 3

  20. 블루아카) 페로로지라 총력전 요약 3

  21. 든링) 뒤잡 안되는 몹 뭐있음? 0

  22. 오늘 저녁에 술 얻어먹으러 가는데... 6

  23. 오하코스 대회) 초대 듀얼왕이 되보세요 0

  24. 말딸,약후) 레이스 후 땀이 많이 나는 고루시 0

목록
Board Pagination Prev 1 ... 84 85 86 87 88 89 90 91 92 93 ... 426 Next
/ 426