ميدياويكي:Script/Modal.js

ملاحظة: بعد الحفظ، أنت قد تحتاج إلى إفراغ الكاش الخاص بمتصفحك لرؤية التغييرات.

• فايرفوكس / سافاري: أمسك Shift أثناء ضغط Reload، أو اضغط على إما Ctrl-F5 أو Ctrl-R (⌘-R على ماك)
• جوجل كروم: اضغط Ctrl-Shift-R (⌘-Shift-R على ماك)
• إنترنت إكسبلورر: أمسك Ctrl أثناء ضغط Refresh، أو اضغط Ctrl-F5
• أوبرا: اذهب إلى Menu → Settings (Opera → Preferences على ماك) ثم إلى Privacy & security → Clear browsing data → Cached images and files.

function createModalInteraction(content){
  
  var boutonModal = content.querySelector(".button");
  var modalContent = content.querySelector(".modal");
  var boutonClose = content.querySelector(".close");
  
  boutonModal.addEventListener("click", function() {
    boutonModal.classList.add("tabber-active");
    modalContent.classList.add("gen-active");
    
    boutonClose.addEventListener("click", function() {
      boutonModal.classList.remove("tabber-active");
      modalContent.classList.remove("gen-active");
    });
    
    window.addEventListener("click", function(e) {
      if (e.target == modalContent) {
        boutonModal.classList.remove("tabber-active");
        modalContent.classList.remove("gen-active");
      }
    });
  });
}

(function(){
  var modalContainers = document.querySelectorAll("div#mw-content-text div.modalContainer");
  modalContainers.forEach(function(modalContainer){
    createModalInteraction(modalContainer);
  });
})();