잡담
2022.07.13 11:28
혹시 JS 잘하는 사람 공지 어떻게 숨기는지 좀 도와주셈
조회 수 64 추천 수 0 댓글 8
대략 어떤걸 숨겨야 할지는 알겠는데 문제는 공지 접기 버튼을 누르면 공지 펼치기로 바뀌는 부분과 새로고침을 해도 공지 접기나 펼치기 상태가 게시판 한정으로 반영이 되어야함. 이걸 보르겠음.
Who's 뉴리대장
가끔 사람들의 상상력은 대단한 것 같아
Share-
-
?
<!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 파일로 만들어서 테스트 해보시면 될듯
생각하시는게 다를거 같아서 틀릴수도있을거같은데 개인적으로는 공부가 되서 잘 써먹을듯요 -
?
https://joshua-dev-story.blogspot.com/2020/09/javascript-collapse.html
이 블로그 참고해보시는건 어떨지?
고정은 css style 쪽에서 고정시키거나 따로 값을 가지고 있게해서 적용해야할거같은데 그건 좀더 찾아봐야할듯요
-
?
css 고정은 localstorage 라는게 잇어서 찾아보고있는데 얼추 정리되면 예시코드 한번 드릴수있을듯요
-
일단 공지글 자체는 tr.notice만 날리면 됨. 그 날리는 버튼을 어떻게 만드는지가 문제임.
-
?
<!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 파일로 만들어서 테스트 해보시면 될듯
생각하시는게 다를거 같아서 틀릴수도있을거같은데 개인적으로는 공부가 되서 잘 써먹을듯요 -
?
html 코드 이대로 올려도 괜찮은지는 모르겟는데 문제가 된다면 얘기해주시면 바로 삭제하겟습니다~
-
감사합니다. 제이쿼리 없는 바닐라 js네요. 해당 코드 참조해서 구현해 보도록 하겠습니다.
-
?
화이팅입니다 ^^
-
이거 내가 파일 목록 접기 스크립트 만들어놓은 거 쿠키랑 섞어 쓰면 될 텐데
유머/자유 게시판
유머를 포함하여 국내 정치 이외의 이야기를 자유롭게 할 수 있는 게시판 입니다
베스트
더보기| 잡담 정신적으로 안정되었는줄 알았는데 아니다. 8 | 2024-05-21 07:57 | 사막눈여우 |
유머
뉴진스님 윤성호 근황.jpg
2
|
2024-05-19 22:11 | 바티칸시국 |
|
창작(자작)
간만에 찾아와서 뻘그림 남기고 감미다
3
|
2024-05-13 23:30 | 뉴리넷-5275662544 |
|
유머
노동절 기념) 일자리에 대한 교황의 기도.jpg
3
|
2024-05-01 22:55 | 바티칸시국 |
|
유머
특허로 갑질한 회사의 최후
4
|
2024-04-27 14:35 | The_Libertines |
|
잡담
흥분한 강아지 진정시키기
3
|
2024-04-22 20:47 | 사막눈여우 |
|
유머
[유머]왜.. CG 를 넣은걸까.
1
|
2024-04-22 11:52 | 사막눈여우 |
| 번호 | 분류 | 제목 | 글쓴이 | 날짜 | 추천 수 | 조회 수 |
|---|---|---|---|---|---|---|
| 공지 | 우리 사이트는 스퀘어발 난민을 환영합니다 | 뉴리대장 | 2023.12.18 | 5 | 849 | |
| 공지 | 사이트 이용 규칙(2024.02.23. 수정) 17 | 뉴리대장 | 2022.06.29 | 33 | 3344 | |
| 공지 | 공지 | 수위가 있는 게시물에 대해 3 | 뉴리대장 | 2022.07.04 | 12 | 1513 |
| 공지 | 공지 | 유머/자유 게시판 이용 안내 및 규칙 7 | 뉴리대장 | 2022.06.29 | 19 | 1803 |
| 6727 | 잡담 | 세상이 떠내려갈것처럼 비가 내리네 2 | Cpt_Titus | 2022.07.12 | 0 | 62 |
| 6726 | 잡담 |
유희왕 ) 용사 나왔다길래 구경해봣는데
|
똑똑한얼굴 | 2022.07.13 | 0 | 65 |
| 6725 | 잡담 |
@) 4명중 3명 성공했다
|
VAAS | 2022.07.13 | 0 | 29 |
| 6724 | 잡담 |
@) 와 줄리아 떴다 ㅋㅋㅋㅋㅋㅋㅋㅋㅋ
|
VAAS | 2022.07.13 | 0 | 22 |
| 6723 | 애니/서브컬쳐 |
말딸)하루우라라와 히소카 트레이너야!(2).manhwa
|
마음의거울 | 2022.07.13 | 0 | 249 |
| 6722 | 게임 |
@) 밀리는 이제 다시 우선순위 하락이다
|
佐久間リチュア | 2022.07.13 | 0 | 31 |
| 6721 | 잡담 |
웹 개발 같은 웹쪽에 관심있는 사람이 흥미로운 확장기능
1
|
뉴리대장 | 2022.07.13 | 0 | 65 |
| 6720 | 잡담 | 닭가슴살을 대량으로 시킴. 8 | 루미 | 2022.07.13 | 0 | 53 |
| 6719 | 잡담 | 웹개발은 너무 어려움 ㅠㅠ 8 | 갓수가되고싶따 | 2022.07.13 | 0 | 63 |
| 6718 | 잡담 |
ㅅㅂ 자가진단 2줄 나왔네
3
|
추가열 | 2022.07.13 | 0 | 84 |
| 6717 | 잡담 | 코로나로 출근안하는거는 별론데 1 | 추가열 | 2022.07.13 | 0 | 46 |
| 6716 | 잡담 | 기억의 왜곡 1 | crys | 2022.07.13 | 0 | 33 |
| 6715 | 잡담 | 갤러리 섬네일 크기 개선함 | 뉴리대장 | 2022.07.13 | 0 | 26 |
| » | 잡담 | 혹시 JS 잘하는 사람 공지 어떻게 숨기는지 좀 도와주셈 8 | 뉴리대장 | 2022.07.13 | 0 | 64 |
| 6713 | 애니/서브컬쳐 |
가끔 사람들의 상상력은 대단한 것 같아
3
|
루리웹-2809288201 | 2022.07.13 | 0 | 59 |
| 6712 | 잡담 |
블루아카) 페로로지라 총력전 요약
3
|
SBR레이서 | 2022.07.13 | 0 | 163 |
| 6711 | 잡담 | 든링) 뒤잡 안되는 몹 뭐있음? | 상자 | 2022.07.13 | 0 | 38 |
| 6710 | 잡담 | 오늘 저녁에 술 얻어먹으러 가는데... 6 | 갓수가되고싶따 | 2022.07.13 | 0 | 31 |
| 6709 | 게임 | 오하코스 대회) 초대 듀얼왕이 되보세요 | 벨즈쨩 | 2022.07.13 | 0 | 40 |
| 6708 | 애니/서브컬쳐 |
말딸,약후) 레이스 후 땀이 많이 나는 고루시
|
페도에겐거유짤을 | 2022.07.13 | 0 | 69 |
감사합니다. 제이쿼리 없는 바닐라 js네요. 해당 코드 참조해서 구현해 보도록 하겠습니다.