- 移除 iPhone 模拟器,改为直接使用 iframe 嵌入瞬间页面 - 更新瞬间链接为实际 URL,取消 javascript:void(0)- 调整 iframe 容器样式,设置初始隐藏状态- 重构 moments.js,简化代码结构,优化动画效果 - 更新 CSS 链接为相对路径,提高性能
58 lines
1.7 KiB
JavaScript
58 lines
1.7 KiB
JavaScript
$(document).ready(function () {
|
||
const iframe = document.getElementById('moment-frame');
|
||
const momentsContainer = document.getElementById('moments-container');
|
||
|
||
function animateIframe() {
|
||
momentsContainer.style.display = 'block';
|
||
momentsContainer.classList.add('visible');
|
||
}
|
||
|
||
function openMoments(url) {
|
||
if (iframe.src == null || iframe.src === '' || iframe.src !== url) {
|
||
iframe.src = url;
|
||
|
||
iframe.onload = () => {
|
||
setTimeout(() => {
|
||
animateIframe();
|
||
}, 300); // 延迟更自然
|
||
};
|
||
} else {
|
||
animateIframe();
|
||
}
|
||
}
|
||
|
||
// 处理瞬间链接点击事件
|
||
$('.moments-link').on('click', function (e) {
|
||
e.preventDefault(); // 阻止默认跳转
|
||
|
||
// 获取链接地址
|
||
const url = "https://moments.hehouhui.cn";
|
||
|
||
// 判断是否是移动端
|
||
const isMobile = /iPhone|Android/i.test(navigator.userAgent);
|
||
|
||
if (isMobile) {
|
||
// 移动端:直接跳转
|
||
window.location.href = url;
|
||
} else {
|
||
// PC端:在iframe中显示
|
||
openMoments(url);
|
||
}
|
||
});
|
||
|
||
// 关闭按钮点击事件
|
||
$('.close-btn').on('click', function () {
|
||
momentsContainer.classList.remove('visible');
|
||
setTimeout(() => {
|
||
momentsContainer.style.display = 'none';
|
||
}, 500); // 等待动画结束后隐藏
|
||
});
|
||
|
||
// 遮罩层点击事件 点击空白处关闭模拟器
|
||
$('.overlay').on('click', function () {
|
||
momentsContainer.classList.remove('visible');
|
||
setTimeout(() => {
|
||
momentsContainer.style.display = 'none';
|
||
}, 500); // 等待动画结束后隐藏
|
||
});
|
||
}); |