참고: 설정을 저장한 후에 바뀐 점을 확인하기 위해서는 브라우저의 캐시를 새로 고쳐야 합니다.
- 파이어폭스 / 사파리: Shift 키를 누르면서 새로 고침을 클릭하거나, Ctrl-F5 또는 Ctrl-R을 입력 (Mac에서는 ⌘-R)
- 구글 크롬: Ctrl-Shift-R키를 입력 (Mac에서는 ⌘-Shift-R)
- 인터넷 익스플로러 / 엣지: Ctrl 키를 누르면서 새로 고침을 클릭하거나, Ctrl-F5를 입력.
- 오페라: Ctrl-F5를 입력.
document.addEventListener('DOMContentLoaded', function () {
const collapsibles = document.querySelectorAll('.mw-collapsible');
collapsibles.forEach(function(collapsible) {
const trigger = collapsible.querySelector('.mw-collapsible-toggle'); // 펼치기/접기 버튼
const content = collapsible.querySelector('.mw-collapsible-content'); // 펼쳐질 내용
// 펼치기/접기 버튼 클릭 시
trigger.addEventListener('click', function() {
if (content.style.maxHeight) {
// 접기 상태일 때
content.style.maxHeight = null; // 접기
content.style.transform = "translateY(-20px)"; // 위로 애니메이션
} else {
// 펼치기 상태일 때
content.style.maxHeight = content.scrollHeight + "px"; // 실제 내용의 높이에 맞춰 펼치기
content.style.transform = "translateY(0)"; // 원래 위치로 이동
}
});
});
});