MediaWiki:Common.js: различия между версиями
Перейти к навигации
Перейти к поиску
Нет описания правки Метка: ручная отмена |
Нет описания правки |
||
| (не показано 7 промежуточных версий этого же участника) | |||
| Строка 1: | Строка 1: | ||
// Находим все изображения на странице | |||
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(); | |||
} | |||
}); | |||
}); | |||
}); | |||
Текущая версия от 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();
}
});
});
});