2024跨年倒计时烟花秀 除夕最炫烟花代码 |
您所在的位置：网站首页 › 新年烟花代码c语言 › 2024跨年倒计时烟花秀 除夕最炫烟花代码 |
2024跨年倒计时烟花秀 除夕最炫烟花代码
|
📋 前言
🖱 博客主页：在下马农的碎碎念✍ 本文由在下马农原创，首发于CSDN📆 首发时间：2023/12/29📅 最近更新时间：2023/12/29🤵 此马非凡马，房星本是星。向前敲瘦骨，犹自带铜声。🙏作者水平有限，如发现错误，请留言轰炸哦！万分感谢！🤗 欢迎关注🔎点赞👍收藏⭐️留言📝先赞后看，腰缠万贯
2024全新龙辰辰版新年倒计时烟花秀送给大家。 龙辰辰版新年倒计时，倒计时页面由几张龙辰辰吉祥物和其他图片作为背景，图片可替换为你想展示的图片，中间显示倒计时的时间，等到时间归零，将会开启一场绚丽的烟花秀，迎接2024。让我们一起欣赏吧！！！ 《《神奇的HTML总目录》》汇集所有绚丽HTML效果，分享所有源码，小白也可体验前端HTML的乐趣 目录传送门：🍒🍒神奇的HTML🍒🍒 一、效果展示 1.1 预览图
龙年烟花倒计时演示 1.3 预览链接博主已将神奇的HTML专栏文章中所有效果部署上线，预览效果请进入： 神奇的HTML专栏代码效果预览 二、自定义修改 2.1 修改倒计时页面背景音乐倒计时页面背景音乐的设置代码位于文件index.html的第13行，将audio标签中的source标签的src属性值修改为你想要添加的音乐所在目录即可，也可修改为在线的外部链接。 2.2 修改烟花页面背景音乐烟花页面背景音乐的设置代码位于文件firework.html的第20行，将audio标签中的source标签的src属性值修改为你想要添加的音乐所在目录即可，也可修改为在线的外部链接。 2.3 倒计时时间设定倒计时的预定时间也是可以自定义的，现在文件默认是2024/01/01 00:00:0，这个时间可以设定成任何日子，比如女朋友的生日，或者其他的任何节日时间。 修改的代码位于文件夹js中的script.js文件第73行，改下时间即可。 72 function show_runtime() { 73 var newDay = '2024/01/01 00:00:00'; 74 var countDate = new Date(newDay); 2.3 背景图片设定如果你想要用在其他的节日或者日期，那么背景图片的更换也是必不可少的，现在默认是四张图片轮换。使用的图片名为long1.png-long4.png 非常简单的替换方式是直接拿四张照片更改为long1.png-long4.png放入image文件夹中即可。 复杂一点的方式是将你的照片命名为相同的名字+不同的数字，例如photo1.png photo2.png photo3.png，然后修改文件夹js中的script.js文件第118行，将long换为你自己的图片，即photo。然后再将114行中的数字5改为你的图片数量加一，本例中就应修改为3+1=4。 110 function downTime() { 111 let item = 1; 112 setInterval(() => { 113 item++; 114 if (item === 5) { 115 item = 1; 116 } 117 console.log(item, 'item'); 118 document.body.style.backgroundImage = `url(./image/long${item}.png)`; 119 return item; 120 e.stopPropagation(); //取消事件冒泡 121 }, 2000); 122 2.4 倒计时页面文字设定如果你想要修改倒计时页面的文字，可以修改文件index.html中第16行。 span中是上边部分小字，2023的位置对应大字体。 13 龙年倒计时2024 三、如何在自己电脑上运行运行步骤： 3.1 下载源码文末附源代码下载方式 3.2 运行直接双击index.html即可运行，快来试试吧！！！ 四、源代码分享有需要源码的小伙伴可以扫描下方二维码回复 关键词 2024烟花，下载链接在文章末尾！ 汇集所有绚丽HTML效果，分享所有源码，小白也可体验前端HTML的乐趣 目录传送门：🍒🍒神奇的HTML🍒🍒 参考文章链接：https://blog.csdn.net/geyaoisnice/article/details/122460313 烟花代码原作者：Caleb Miller 往期精彩： 💝2022烟花分享💝 💝2023 3D版烟花分享💝 |
【本文地址】
今日新闻 |
推荐新闻 |