过年啦🎊给咱小站也来一场壮丽的🎇烟火表演秀吧 New
只用把以下代码放到后台 - 全局 - 站点信息 - 网站第三方统计代码
<button id="fireworks-btn" title="烟火秀" style="position: fixed; bottom: 20px; right: 20px; cursor: pointer; z-index: 1000;"> 🎆</button><div id="fireworks-container" style="display: none; position: fixed; top: 0; left: 0; width: 100%; height: 100%; z-index: 999;"> <iframe id="fireworks-iframe" style="width: 100%; height: 100%; border: none; opacity: 0.8;"></iframe></div><script>document.getElementById('fireworks-btn').addEventListener('click', function () { const container = document.getElementById('fireworks-container'); const iframe = document.getElementById('fireworks-iframe'); if (container.style.display === 'none' || container.style.display === '') { if (!iframe.src) { iframe.src = 'https://cn.admxn.com/fireworks/dist/index.html'; } container.style.display = 'block'; } else { container.style.display = 'none'; }});</script>
返回前端就能看到右下角的烟火小按钮啦
DEMO:https://cn.admxn.com/
如需本地部署可下载解压后传至站点根目录，然后将上面iframe.src = 'https://cn.admxn.com/fireworks/dist/index.html';中的域名改为你的域名即可 你好！感谢你分享这个有趣的烟火效果代码。如果你想在你的Discuz站点上实现这个效果，可以按照以下步骤操作：
### 1. **将代码放入网站第三方统计代码**
- 登录Discuz后台，进入 **全局** -> **站点信息** -> **网站第三方统计代码**。
- 将你提供的代码粘贴到统计代码框中，然后保存。
### 2. **前端页面添加HTML结构**
- 为了让烟火效果正常工作，你需要在Discuz的前端页面中添加一些HTML结构。你可以通过修改模板文件来实现。
- 打开你的模板文件（通常是 `template/default/common/footer.htm`），在文件底部添加以下代码：
<div id="fireworks-container" style="display: none; position: fixed; bottom: 20px; right: 20px; z-index: 9999;">
<iframe id="fireworks-iframe" width="300" height="300" frameborder="0"></iframe>
</div>
<button id="fireworks-btn" style="position: fixed; bottom: 20px; right: 20px; z-index: 10000; padding: 10px; background-color: #ff5722; color: white; border: none; cursor: pointer;">🎆 烟火表演</button>
- 这段代码会在页面右下角添加一个按钮和一个隐藏的iframe容器，点击按钮时会显示或隐藏烟火效果。
### 3. **本地部署（可选）**
- 如果你想将烟火效果部署到本地服务器，可以下载烟火效果的资源文件，解压后上传到你的站点根目录。
- 然后修改代码中的 `iframe.src`，将其指向你本地的文件路径。例如：
iframe.src = 'https://你的域名/fireworks/dist/index.html';
### 4. **测试效果**
- 保存所有更改后，刷新你的网站前端页面，你应该会在右下角看到一个烟火按钮。点击按钮即可看到烟火效果。
### 注意事项：
- 如果你使用的是自定义模板，请确保在正确的模板文件中添加代码。
- 如果你在本地部署烟火效果，请确保文件路径正确，并且服务器能够正常访问这些文件。
希望这个烟火效果能为你的站点增添节日气氛！如果有其他问题，欢迎随时提问。🎉
-- 本回答由 人工智能 AI智能体 生成，内容仅供参考，请仔细甄别。
页:
[1]