본문 바로가기
조회 수 74 추천 수 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

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


유머/자유 게시판

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

List of Articles
번호 분류 제목 글쓴이 날짜 추천 수 조회 수
공지 사이트 이용 규칙(2024.02.23. 수정) 17 뉴리대장 2022.06.29 34 3801
공지 공지 수위가 있는 게시물에 대해 3 뉴리대장 2022.07.04 12 2050
공지 공지 유머/자유 게시판 이용 안내 및 규칙 7 뉴리대장 2022.06.29 19 2122
공지 숨기기
4695 잡담 블아)곧 gs 7월 콜라보가 온다 1 오버도즈 2024.06.27 2 20
4694 잡담 오늘 도착한 중고 CD 2장 1 file 트라린 2024.07.03 1 20
4693 잡담 뚱땡이 택견하러 가는중 5 file 정달호 2024.07.19 2 20
4692 잡담 올림픽 위원회가 한국을 북한이라고 소개한 이유 2 정달호 2024.07.28 2 20
4691 잡담 사이드바의 이미지만 있는 댓글 클릭 안되는 현상에 대해 1 뉴리대장 2022.07.09 0 21
4690 잡담 씻고 게임해야지 추가열 2022.09.06 0 21
4689 잡담 역시 출근하는게 제일 힘들다 추가열 2022.09.07 0 21
4688 잡담 아침 버스 6시 타려고 밤새는게 웃기네 ㅋㅋ.. 추가열 2022.09.28 0 21
4687 잡담 야구 왜 이기고 있지 추가열 2023.03.10 0 21
4686 잡담 p의거짓 3회차중 IIIiiiIIiIIIi 2023.10.26 0 21
4685 잡담 노래) George Harrison - Wah-Wah 트라린 2024.06.25 2 21
4684 잡담 스바루인줄 알았던 스바루가 스바루를 타는.avi 2 file 정달호 2024.07.04 1 21
4683 잡담 RG레프 짱싸네 3 file 오버도즈 2024.07.05 1 21
4682 잡담 굿모닝 맥모닝 3 file 트라린 2024.07.07 1 21
4681 잡담 식지 않는 SON축구아카데미 아동 학대 논란, 이번엔 감독-코치들의 욕설·폭언 담긴 영상 공개 1 머레보 2024.07.07 0 21
4680 잡담 얼마만에 만나는 햇님인지 모르겠다 3 file 트라린 2024.07.10 2 21
4679 잡담 장마철이라 그런지 사건사고가 끊이질 않네 3 사쿠라미코 2024.07.14 1 21
4678 잡담 로또 1등 63명, 2등 77명 2 file 수상한변태 2024.07.15 0 21
4677 잡담 성님덜, 이거 여기 후원은 어케해요? 2 file 정달호 2024.07.16 1 21
4676 잡담 진짜 보기 어려운 사진 2 file 수상한변태 2024.07.18 1 21
목록
Board Pagination Prev 1 2 3 4 5 6 7 8 9 10 ... 240 Next
/ 240