弹窗之小尺寸

弹窗之小尺寸
NodeSupport | Promotion在页尾添加以下配置代码实现首页弹窗
inject:
head:
# 自定义css
# -
bottom:
# 自定义js
# -
# 下面是调整了 iframe 样式和 ID 的弹窗代码
- |
<!-- Promotion Popup CSS (保持上次的宽度和内边距) -->
<style>
.popup-overlay {
position: fixed;
top: 0;
left: 0;
width: 100%;
height: 100%;
background-color: rgba(0, 0, 0, 0.6);
display: flex;
justify-content: center;
align-items: center;
z-index: 1000;
}
.popup-content {
background-color: #fff;
padding: 15px;
border-radius: 10px;
position: relative;
width: 300px; /* 固定宽度,模拟侧边栏卡片宽度 (可按需修改) */
box-shadow: 0 5px 15px rgba(0,0,0,0.3);
/* 可能需要根据 transform 调整容器尺寸或添加 overflow: hidden; */
/* overflow: hidden; */ /* 如果 scale 导致内容溢出,可以取消此行注释 */
}
.popup-close {
position: absolute;
top: 8px;
right: 12px;
font-size: 22px;
font-weight: bold;
color: #aaa;
cursor: pointer;
z-index: 1; /* 确保关闭按钮在iframe之上 */
}
.popup-close:hover {
color: #333;
}
.popup-content iframe {
display: block; /* 确保 iframe 正确显示 */
box-sizing: border-box; /* 确保 padding 和 border 包含在宽度内 */
}
</style>
<!-- Promotion Popup JavaScript (保持不变) -->
<script>
function showPromotionPopup() {
if (window.location.pathname === '/' || window.location.pathname === '/index.html') {
// if (!localStorage.getItem('promotionPopupShown')) { // 取消注释以启用“只显示一次”
var popup = document.getElementById('promotion-popup');
if (popup) {
popup.style.display = 'flex';
// localStorage.setItem('promotionPopupShown', 'true'); // 取消注释以启用“只显示一次”
}
// }
}
}
function closePromotionPopup() {
var popup = document.getElementById('promotion-popup');
if (popup) {
popup.style.display = 'none';
}
}
window.addEventListener('load', showPromotionPopup);
// var overlay = document.getElementById('promotion-popup');
// if (overlay) {
// overlay.addEventListener('click', function(event) {
// if (event.target === overlay) {
// closePromotionPopup();
// }
// });
// }
</script>
CDN
… 后面的 CDN 配置保持不变 …
[up主专用,视频内嵌代码贴在这]






