返回列表 发帖
查看: 339|回复: 9

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

10

主题

174

回帖

307

积分

应用开发者

贡献
16 点
金币
18 个
QQ
发表于 2025-1-24 10:20:46 | 显示全部楼层 |阅读模式


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

  1. <button id="fireworks-btn" title="烟火秀" style="position: fixed; bottom: 20px; right: 20px; cursor: pointer; z-index: 1000;">
  2.     🎆
  3. </button>
  4. <div id="fireworks-container" style="display: none; position: fixed; top: 0; left: 0; width: 100%; height: 100%; z-index: 999;">
  5.     <iframe id="fireworks-iframe" style="width: 100%; height: 100%; border: none; opacity: 0.8;"></iframe>
  6. </div>

  7. <script>
  8. document.getElementById('fireworks-btn').addEventListener('click', function () {
  9.     const container = document.getElementById('fireworks-container');
  10.     const iframe = document.getElementById('fireworks-iframe');

  11.     if (container.style.display === 'none' || container.style.display === '') {
  12.         if (!iframe.src) {
  13.             iframe.src = 'https://cn.admxn.com/fireworks/dist/index.html';
  14.         }
  15.         container.style.display = 'block';
  16.     } else {
  17.         container.style.display = 'none';
  18.     }
  19. });
  20. </script>
复制代码


返回前端就能看到右下角的烟火小按钮啦
DEMO:https://cn.admxn.com/

如需本地部署可下载 fireworks.zip (93.88 KB, 下载次数: 20) 解压后传至站点根目录,然后将上面iframe.src = 'https://cn.admxn.com/fireworks/dist/index.html';中的域名改为你的域名即可

游客,如果您要查看本帖隐藏内容请回复

回复

使用道具 举报

19

主题

271

回帖

399

积分

炉火纯青

贡献
2 点
金币
57 个
发表于 2025-1-24 14:19:31 | 显示全部楼层
看起来不错,挺应景的,谢谢大大的分享。
回复 支持 反对

使用道具 举报

11

主题

93

回帖

109

积分

渐入佳境

贡献
0 点
金币
2 个
发表于 2025-1-24 23:12:27 | 显示全部楼层
打开demo没有烟花啊
回复 支持 反对

使用道具 举报

28

主题

213

回帖

255

积分

炉火纯青

贡献
0 点
金币
1 个
QQ
发表于 2025-1-25 08:50:56 | 显示全部楼层
看看。感谢您的分享。
回复 支持 反对

使用道具 举报

20

主题

82

回帖

115

积分

渐入佳境

贡献
0 点
金币
4 个
QQ
发表于 2025-1-25 16:33:00 | 显示全部楼层
感谢分享  
回复 支持 反对

使用道具 举报

14

主题

93

回帖

134

积分

渐入佳境

贡献
2 点
金币
2 个
发表于 2025-1-25 19:32:51 | 显示全部楼层
<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>
回复 支持 反对

使用道具 举报

57

主题

455

回帖

573

积分

自成一派

贡献
7 点
金币
1 个
发表于 2025-1-26 17:30:03 | 显示全部楼层
顶楼主啦..希望楼主多发精品好帖啦.....
回复 支持 反对

使用道具 举报

32

主题

35

回帖

72

积分

渐入佳境

贡献
0 点
金币
0 个
发表于 2025-1-27 08:57:16 来自手机 | 显示全部楼层
好耶✌🏻
回复

使用道具 举报

1

主题

17

回帖

24

积分

初学乍练

贡献
0 点
金币
5 个
发表于 2025-1-27 17:44:02 | 显示全部楼层
kankan看看
回复 支持 反对

使用道具 举报

10

主题

174

回帖

307

积分

应用开发者

贡献
16 点
金币
18 个
QQ
 楼主| 发表于 5 天前 | 显示全部楼层

页面右下角有个小按钮🎆
回复 支持 反对

使用道具 举报

您需要登录后才可以回帖 登录 | 立即注册

本版积分规则

  • 关注公众号
  • 有偿服务微信
  • 有偿服务QQ

手机版|小黑屋|Discuz! 官方交流社区 ( 皖ICP备16010102号 |皖公网安备34010302002376号 )|网站地图|star

GMT+8, 2025-2-10 01:05 , Processed in 0.054506 second(s), 9 queries , Redis On.

Powered by Discuz! W1.0 Licensed

Cpoyright © 2001-2024 Discuz! Team.

关灯 在本版发帖
有偿服务QQ
有偿服务微信
返回顶部
快速回复 返回顶部 返回列表