미디어위키:Common.css: 두 판 사이의 차이

2026년 7월 3일 (금) 08:53 판

/* 이 자바스크립트 설정은 모든 문서, 모든 사용자에게 적용됩니다. */
/* MediaWiki:Common.js 에 이 파일 내용 전체를 붙여넣으세요. (CSS는 넣지 말 것!) */

/* ===== 외부 링크 새 창 열기 ===== */
$(document).ready(function () {
  $('#bodyContent a.external').attr('target', '_blank').attr('rel', 'noopener noreferrer');
});

/* ===== 목차 박스 드래그 이동 =====
   (원치 않으면 이 블록 전체를 삭제해도 됩니다.
    새 디자인은 목차가 본문 안 박스로 정리되어 있어 고정(fixed) 배치는 껐습니다) */
mw.loader.using('jquery.ui', function () {
  if ($('#toc').length === 0) return;
  $('#toc').css({ cursor: 'move' });
  $('#toc').draggable({
    containment: 'window',
    scroll: false
  });
});

/* ===== Google 자동 번역 위젯 =====
   처음에는 배너 옆(카드 오른쪽 여백)에 있다가,
   스크롤해서 지나치면 화면 상단에 고정되어 계속 보입니다. */
mw.loader.using('mediawiki.util', function () {

  var $div = $('<div id="google_translate_element"></div>');
  // 본문 카드(.mw-body)에 붙여서 카드 기준으로 위치 고정 (없으면 body)
  var $anchor = $('.mw-body').first();
  ($anchor.length ? $anchor : $('body')).append($div);

  // 스크롤 시 상단 고정 전환
  var PIN_AT = 200; // 이만큼 스크롤하면 상단 고정 (배너를 지나는 지점)
  function updateTranslatePos() {
    var el = document.getElementById('google_translate_element');
    var body = document.querySelector('.mw-body');
    if (!el || !body) return;
    var pinned = window.scrollY > PIN_AT;
    el.classList.toggle('gt-pinned', pinned);
    // 넓은 화면에서 고정 시: 카드 오른쪽 모서리에 맞춰 가로 위치 유지
    if (pinned && window.innerWidth > 1420) {
      el.style.left = (body.getBoundingClientRect().right + 22) + 'px';
    } else {
      el.style.left = '';
    }
  }
  window.addEventListener('scroll', updateTranslatePos, { passive: true });
  window.addEventListener('resize', updateTranslatePos);
  updateTranslatePos();

  window.googleTranslateElementInit = function () {
    new google.translate.TranslateElement({
      pageLanguage: 'ko',
      includedLanguages: 'en,ja,ko',
      layout: google.translate.TranslateElement.InlineLayout.SIMPLE,
      autoDisplay: false
    }, 'google_translate_element');
  };

  var script = document.createElement('script');
  script.src = '//translate.google.com/translate_a/element.js?cb=googleTranslateElementInit';
  document.body.appendChild(script);
});