MediaWiki:Common.js: различия между версиями
Перейти к навигации
Перейти к поиску
Нет описания правки |
Нет описания правки |
||
| Строка 1: | Строка 1: | ||
// Находим все изображения на странице | // Находим все изображения на странице | ||
var images = document.querySelectorAll('.mw-default-size img'); | var images = document.querySelectorAll('.mw-default-size img'); | ||
// Для каждого изображения добавляем обработчик события | // Для каждого изображения добавляем обработчик события | ||
images.forEach(function(image) { | images.forEach(function(image) { | ||
image.addEventListener('click', function() { | image.addEventListener('click', function(event) { | ||
// Отменяем переход по ссылке | // Отменяем переход по ссылке | ||
event.preventDefault(); | event.preventDefault(); | ||
// Создаем элемент для полноэкранного просмотра | // Создаем элемент для полноэкранного просмотра | ||
var fullscreenContainer = document.createElement('div'); | var fullscreenContainer = document.createElement('div'); | ||
| Строка 35: | Строка 34: | ||
// Добавляем контейнер в тело документа | // Добавляем контейнер в тело документа | ||
document.body.appendChild(fullscreenContainer); | document.body.appendChild(fullscreenContainer); | ||
// Добавляем обработчик события клика на контейнер полноэкранного просмотра | |||
fullscreenContainer.addEventListener('click', function(event) { | |||
// Проверяем, был ли клик выполнен вне изображения | |||
if (event.target === fullscreenContainer) { | |||
// Удаляем элементы при клике на пустую область | |||
fullscreenContainer.remove(); | |||
} | |||
}); | |||
}); | }); | ||
}); | }); | ||
Текущая версия от 13:05, 27 апреля 2024
// Находим все изображения на странице
var images = document.querySelectorAll('.mw-default-size img');
// Для каждого изображения добавляем обработчик события
images.forEach(function(image) {
image.addEventListener('click', function(event) {
// Отменяем переход по ссылке
event.preventDefault();
// Создаем элемент для полноэкранного просмотра
var fullscreenContainer = document.createElement('div');
fullscreenContainer.className = 'fullscreen-container';
// Создаем изображение для полноэкранного просмотра
var fullscreenImage = document.createElement('img');
fullscreenImage.src = image.src;
fullscreenImage.className = 'fullscreen-image';
// Создаем кнопку для закрытия полноэкранного режима
var closeButton = document.createElement('button');
closeButton.textContent = 'Закрыть';
closeButton.className = 'close-button';
// Добавляем обработчик события для кнопки закрытия
closeButton.addEventListener('click', function() {
// Удаляем элементы при закрытии полноэкранного режима
fullscreenContainer.remove();
});
// Добавляем изображение и кнопку закрытия в контейнер для полноэкранного просмотра
fullscreenContainer.appendChild(fullscreenImage);
fullscreenContainer.appendChild(closeButton);
// Добавляем контейнер в тело документа
document.body.appendChild(fullscreenContainer);
// Добавляем обработчик события клика на контейнер полноэкранного просмотра
fullscreenContainer.addEventListener('click', function(event) {
// Проверяем, был ли клик выполнен вне изображения
if (event.target === fullscreenContainer) {
// Удаляем элементы при клике на пустую область
fullscreenContainer.remove();
}
});
});
});