|
37 | 37 | oninput="onDarkToggleChange(event)" |
38 | 38 | > |
39 | 39 | </footer> |
| 40 | +<script> |
| 41 | +(function() { |
| 42 | + // 如果本会话已关闭过提示，则不再显示 |
| 43 | + if (sessionStorage.getItem('domainNoticeClosed')) return; |
| 44 | + |
| 45 | + // 创建提示条容器 |
| 46 | + const div = document.createElement('div'); |
| 47 | + div.id = 'domain-notice'; |
| 48 | + div.setAttribute('role', 'status'); |
| 49 | + div.innerHTML = ` |
| 50 | + <div class="domain-notice-inner"> |
| 51 | + <p> |
| 52 | + 提示：本站域名已由 |
| 53 | + <a href="https://imas-sp.com" target="_blank" style="color:#ffd700;text-decoration:underline;">imas-sp.com</a> |
| 54 | + 迁移至 |
| 55 | + <a href="https://sp.idolmaster.top" target="_blank" style="color:#ffd700;text-decoration:underline;">sp.idolmaster.top</a>。 |
| 56 | + 请更新您的书签。 |
| 57 | + </p> |
| 58 | + <button id="close-domain-notice">我知道了</button> |
| 59 | + </div> |
| 60 | + `; |
| 61 | + document.body.appendChild(div); |
| 62 | + |
| 63 | + // 样式 |
| 64 | + const style = document.createElement('style'); |
| 65 | + style.innerHTML = ` |
| 66 | + #domain-notice { |
| 67 | + position: fixed; |
| 68 | + left: 0; |
| 69 | + right: 0; |
| 70 | + bottom: 0; |
| 71 | + z-index: 99999; |
| 72 | + display: flex; |
| 73 | + justify-content: center; |
| 74 | + pointer-events: none; |
| 75 | + } |
| 76 | + .domain-notice-inner { |
| 77 | + pointer-events: auto; |
| 78 | + transform: translateY(120%); |
| 79 | + transition: transform 450ms cubic-bezier(.2,.9,.2,1), opacity 350ms; |
| 80 | + opacity: 0; |
| 81 | + background: rgba(40,40,40,0.95); |
| 82 | + color: #fff; |
| 83 | + padding: 14px 18px; |
| 84 | + margin: 12px; |
| 85 | + border-radius: 8px; |
| 86 | + box-shadow: 0 8px 30px rgba(0,0,0,0.35); |
| 87 | + max-width: 960px; |
| 88 | + width: calc(100% - 48px); |
| 89 | + display: flex; |
| 90 | + align-items: center; |
| 91 | + justify-content: space-between; |
| 92 | + gap: 12px; |
| 93 | + font-size: 14px; |
| 94 | + } |
| 95 | + .domain-notice-inner p { margin:0; line-height:1.3; flex:1; } |
| 96 | + .domain-notice-inner a { color: #ffd700; text-decoration: underline; } |
| 97 | + .domain-notice-inner button { |
| 98 | + background: #00aaff; |
| 99 | + border: none; |
| 100 | + color: #fff; |
| 101 | + padding: 8px 12px; |
| 102 | + border-radius: 6px; |
| 103 | + cursor: pointer; |
| 104 | + font-size: 13px; |
| 105 | + } |
| 106 | + .domain-notice-inner button:active { transform: translateY(1px); } |
| 107 | + @media (max-width:520px){ |
| 108 | + .domain-notice-inner { flex-direction: column; align-items: stretch; gap:8px; text-align:center; } |
| 109 | + .domain-notice-inner button { margin: 0 auto; } |
| 110 | + } |
| 111 | + `; |
| 112 | + document.head.appendChild(style); |
| 113 | + |
| 114 | + // 弹出动画 |
| 115 | + requestAnimationFrame(() => { |
| 116 | + const inner = document.querySelector('.domain-notice-inner'); |
| 117 | + inner.style.transform = 'translateY(0)'; |
| 118 | + inner.style.opacity = '1'; |
| 119 | + }); |
| 120 | + |
| 121 | + // 隐藏函数 |
| 122 | + function hide(immediate = false) { |
| 123 | + const inner = document.querySelector('.domain-notice-inner'); |
| 124 | + if (!inner) return; |
| 125 | + if (immediate) { |
| 126 | + inner.style.transition = 'transform 260ms cubic-bezier(.2,.9,.2,1), opacity 220ms'; |
| 127 | + } |
| 128 | + inner.style.transform = 'translateY(120%)'; |
| 129 | + inner.style.opacity = '0'; |
| 130 | + setTimeout(() => { |
| 131 | + const container = document.getElementById('domain-notice'); |
| 132 | + if (container) container.remove(); |
| 133 | + }, 320); |
| 134 | + } |
| 135 | + |
| 136 | + // 点击“我知道了”关闭提示，并标记为已关闭（仅当前会话） |
| 137 | + document.getElementById('close-domain-notice').addEventListener('click', () => { |
| 138 | + sessionStorage.setItem('domainNoticeClosed', '1'); |
| 139 | + hide(true); |
| 140 | + }); |
| 141 | + |
| 142 | +})(); |
| 143 | +</script> |
0 commit comments