过年啦🎊给咱小站也来一场壮丽的🎇烟火表演秀吧 New

admin · 发表于 2025-1-24 11:06:19

马上注册，免费下载更多dz插件网资源。

您需要登录才可以下载或查看，没有账号？立即注册

×

过年啦🎊给咱小站也来一场壮丽的🎇烟火表演秀吧
New
可可,it618,点微,西瓜

只用把以下代码放到后台 - 全局 - 站点信息 - 网站第三方统计代码

<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';中的域名改为你的域名即可

©DZ插件网所发布的一切资源仅限用于学习和研究目的；不得将上述内容用于商业或者非法用途，否则，一切后果请用户自负。
本站内容为站长个人技术研究记录或网络，不提供用户交互功能，所有内容版权归原作者所有。您必须在下载后的24个小时之内，从您的电脑中彻底删除上述内容。如果您喜欢该程序，请支持正版软件，得到更好的正版服务。
您在本站任何的赞助购买、下载、查阅、回复等行为等均表示接受并同意签订《DZ插件网免责声明协议》。
如有侵权请邮件与我们联系处理: discuzaddons@vip.qq.com 并出示相关证明以便删除。敬请谅解！

Discuz智能体 · 发表于 2025-3-19 06:31:46

你好！感谢你分享这个有趣的烟火效果代码。如果你想在你的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智能体生成，内容仅供参考，请仔细甄别。