참고: 설정을 저장한 후에 바뀐 점을 확인하기 위해서는 브라우저의 캐시를 새로 고쳐야 합니다.
- 파이어폭스 / 사파리: Shift 키를 누르면서 새로 고침을 클릭하거나, Ctrl-F5 또는 Ctrl-R을 입력 (Mac에서는 ⌘-R)
- 구글 크롬: Ctrl-Shift-R키를 입력 (Mac에서는 ⌘-Shift-R)
- 인터넷 익스플로러 / 엣지: Ctrl 키를 누르면서 새로 고침을 클릭하거나, Ctrl-F5를 입력.
- 오페라: Ctrl-F5를 입력.
/* MediaWiki:Common.js */
mw.hook('wikipage.content').add(function ($content) {
var initialized = {};
$content.find('[class*="mw-customtoggle-"]').each(function () {
var classList = (this.className || '').split(/\s+/);
classList.forEach(function (cls) {
if (cls.indexOf('mw-customtoggle-') !== 0) {
return;
}
var suffix = cls.substring('mw-customtoggle-'.length);
if (initialized[suffix]) {
return;
}
initialized[suffix] = true;
var targetId = 'mw-customcollapsible-' + suffix;
/*
* 같은 id가 중복되어 있으므로 #id selector 사용하지 않음
*/
var $sameIds = $content.find('[id="' + targetId + '"]');
/*
* wikitable을 가지고 있는 요소가 실제 펼쳐지는 패널
*/
var $panel = $sameIds.filter(function () {
return $(this).find('table.wikitable').length > 0;
}).first();
if (!$panel.length) {
return;
}
/*
* 위쪽 버튼 wrapper
*/
var $topWrapper = $sameIds.not($panel).filter(function () {
return $(this).find('.' + cls).length > 0;
}).first();
var $topToggle = $topWrapper.find('.' + cls).first();
var $panelToggle = $panel.find('.' + cls).first();
if (!$topToggle.length || !$panelToggle.length) {
return;
}
/*
* 초기 상태
*/
$panel
.addClass('mw-collapsed')
.css({
display: 'none',
overflow: ''
});
/*
* =========================
* 위쪽 버튼 → 펼치기
* =========================
*/
$topToggle
.off('click.smoothSlide')
.on('click.smoothSlide', function (e) {
e.preventDefault();
e.stopImmediatePropagation();
if ($panel.is(':animated') || $panel.is(':visible')) {
return false;
}
/*
* 위쪽 버튼은 바로 제거.
* 그러면 다음 버튼(여성 등)이 아래쪽으로 밀림.
*/
$topWrapper.hide();
/*
* 중요:
* MediaWiki의 collapsed 상태를 먼저 제거
*/
$panel.removeClass('mw-collapsed');
/*
* display:none 상태에서 slideDown 실행
*/
$panel
.stop(true, false)
.hide()
.slideDown(250, function () {
/*
* jQuery 애니메이션 잔여 스타일 제거
*/
$(this).css({
display: '',
height: '',
overflow: '',
paddingTop: '',
paddingBottom: '',
marginTop: '',
marginBottom: ''
});
});
$topToggle.attr('aria-expanded', 'true');
$panelToggle.attr('aria-expanded', 'true');
return false;
});
/*
* =========================
* 펼쳐진 버튼 → 접기
* =========================
*/
$panelToggle
.off('click.smoothSlide')
.on('click.smoothSlide', function (e) {
e.preventDefault();
e.stopImmediatePropagation();
if ($panel.is(':animated')) {
return false;
}
/*
* 접힐 때는 mw-collapsed를 아직 붙이면 안 됨.
*
* 먼저 slideUp을 끝낸 뒤 붙여야
* 애니메이션이 정상적으로 보임.
*/
$panel
.stop(true, false)
.slideUp(250, function () {
/*
* 애니메이션 완료 후 collapsed 상태 복원
*/
$(this)
.addClass('mw-collapsed')
.css({
display: 'none',
height: '',
overflow: '',
paddingTop: '',
paddingBottom: '',
marginTop: '',
marginBottom: ''
});
/*
* 원래 위쪽 버튼 다시 표시
*/
$topWrapper.show();
});
$topToggle.attr('aria-expanded', 'false');
$panelToggle.attr('aria-expanded', 'false');
return false;
});
});
});
});