').addClass('fullscreen-btn fullscreen-btn-left').html('<');
const $btnRight = $('
').addClass('fullscreen-btn fullscreen-btn-right').html('>');
$fullscreenMask.append($fullscreenImg, $btnLeft, $btnRight);
// 将遮罩层添加到 body
$('body').append($fullscreenMask);
setTimeout(function () {
$fullscreenMask.addClass('active');
}, 10);
// 点击遮罩层时关闭
$fullscreenMask.on('click', function (e) {
if (!$(e.target).is($btnLeft) && !$(e.target).is($btnRight)) {
$fullscreenMask.removeClass('active');
setTimeout(function () {
$fullscreenMask.remove();
}, 300);
}
});
// 点击左按钮显示上一张图片
$btnLeft.on('click', function () {
currentImageIndex--;
if (currentImageIndex < 0) {
currentImageIndex = imageSrcArray.length - 1;
}
$fullscreenImg.attr('src', imageSrcArray[currentImageIndex]);
});
// 点击右按钮显示下一张图片
$btnRight.on('click', function () {
currentImageIndex++;
if (currentImageIndex >= imageSrcArray.length) {
currentImageIndex = 0;
}
$fullscreenImg.attr('src', imageSrcArray[currentImageIndex]);
});
});
const $overlay = $('#overlay');
const $videoPlayer = $('#videoPlayer');
const $closeBtn = $('#closeBtn');
const $videoBtns = $('.video-btn');
// 点击播放按钮
$videoBtns.on('click', function() {
const videoSrc = $(this).data('src'); // 获取 data-src 属性
$videoPlayer.attr('src', videoSrc); // 设置视频源
$overlay.css('display', 'flex'); // 显示遮罩层
});
// 点击关闭按钮
$closeBtn.on('click', function() {
$videoPlayer[0].pause(); // 暂停视频
$videoPlayer.attr('src', ''); // 清空视频源
$overlay.hide(); // 隐藏遮罩层
});
// 点击遮罩层关闭
$overlay.on('click', function(event) {
if (event.target === $overlay[0]) { // 判断是否点击的是遮罩层本身
$videoPlayer[0].pause(); // 暂停视频
$videoPlayer.attr('src', ''); // 清空视频源
$overlay.hide(); // 隐藏遮罩层
}
});
// 为 .log-date 绑定点击事件
$('.log-date').on('click', function() {
// 找到当前 .log-date 的同级 .log-line 元素
$(this).siblings('.log-line').toggleClass('active');
});
});