优化界面;修复异常

This commit is contained in:
2026-07-29 00:17:31 +08:00
parent d575d584cb
commit 4b70da9ac3
7 changed files with 105 additions and 25 deletions
+49 -7
View File
@@ -2522,15 +2522,55 @@ function initializeMomentFold() {
// 更换背景函数封装
function setFixedBackground(bgImageUrl) {
const body = document.body;
const requestId = (Number(body.dataset.backgroundRequestId) || 0) + 1;
body.dataset.backgroundRequestId = requestId;
// 传入空值时淡出并清除当前背景。
if (bgImageUrl == null || String(bgImageUrl).trim().toLowerCase() === 'null' || String(bgImageUrl).trim() === '') {
body.querySelectorAll('.fixed-background-layer').forEach((layer) => {
layer.classList.remove('is-visible');
setTimeout(() => layer.remove(), 650);
});
body.classList.remove('common-fixed-bg');
return;
}
const image = new Image();
image.onload = async () => {
if (typeof image.decode === 'function') {
try { await image.decode(); } catch (_) { }
}
if (body.dataset.backgroundRequestId !== String(requestId)) return;
const backgroundLayer = document.createElement('div');
backgroundLayer.className = 'fixed-background-layer';
backgroundLayer.style.backgroundImage = `url('${bgImageUrl}')`;
body.appendChild(backgroundLayer);
// 先应用透明状态,再切换到可见状态,确保每次调用都触发淡入。
backgroundLayer.offsetWidth;
requestAnimationFrame(() => backgroundLayer.classList.add('is-visible'));
body.querySelectorAll('.fixed-background-layer:not(:last-child)').forEach((layer) => {
layer.classList.remove('is-visible');
setTimeout(() => layer.remove(), 650);
});
};
body.classList.add('common-fixed-bg');
body.style.backgroundImage = `url('${bgImageUrl}')`;
image.src = bgImageUrl;
}
// 奇遇显示函数封装
function showCenterImage(imageUrl) {
function showCenterImage(imageUrl, duration = 2000) {
const container = document.getElementById('centerImgContainer');
const img = document.getElementById('targetImg');
// 清理上一次调用遗留的自动关闭定时器。
clearTimeout(container._centerImageCloseTimer);
clearTimeout(container._centerImageResetTimer);
// 重置所有状态(避免上一次操作残留影响)
container.classList.remove('container-fade-active');
img.classList.remove('img-fade-in', 'img-fade-out');
@@ -2547,15 +2587,17 @@ function showCenterImage(imageUrl) {
container.classList.add('container-fade-active');
img.classList.add('img-fade-in');
// 图片显示1.5秒后,执行自动关闭逻辑
setTimeout(() => {
// duration 为 0 时保持显示,不执行自动关闭逻辑
if (duration <= 0) return;
container._centerImageCloseTimer = setTimeout(() => {
container.classList.remove('container-fade-active');
img.classList.add('img-fade-out');
setTimeout(() => {
container._centerImageResetTimer = setTimeout(() => {
img.classList.remove('img-fade-in', 'img-fade-out');
}, 500);
}, 1500);
}, duration);
}
// 定义图片加载失败的回调函数
@@ -2601,7 +2643,7 @@ function anian_renderLunarUI() {
textEl.innerHTML = text;
if (jieqi === '大寒') showCenterImage('/upload/qiyu-jieqi-dahan.png');
if (jieqi) showCenterImage('/upload/' + jieqi + '.webp');
// setFixedBackground('/upload/JX3WJ.mp4_20260207_022345.027.jpg');
};
+9 -4
View File
@@ -517,12 +517,17 @@ $(document).on('click', '.m_volume', function () {
}
});
$(document).on('click', '.vo_bar', function () {
var long = (getMousePosition().top) - ($(this).offset().top)
var meter = long / $(this).height();
var finalLong = 1 - meter;
$(document).on('click', '.vo_bar', function (event) {
var originalEvent = event.originalEvent || event;
var point = originalEvent.changedTouches && originalEvent.changedTouches.length
? originalEvent.changedTouches[0]
: originalEvent;
var offset = $(this).offset();
var meter = (point.pageY - offset.top) / $(this).height();
var finalLong = Math.max(0, Math.min(1, 1 - meter));
$('.vo_size').height(finalLong * $(this).height());
audiobox[0].volume = finalLong;
audiobox[0].muted = finalLong === 0;
});
//文章歌曲