春节灯笼
想为你的博客增添浓浓的春节氛围吗?快来了解我们的独特功能!设定时间后,两个喜庆的灯笼将准时在博客右上角亮起,灯笼上 “新春快乐” 的祝福熠熠生辉,瞬间让你的博客充满节日的欢乐与温馨。这不仅是装饰,更是为访客送上真挚祝福的创意方式,快来探索如何让你的博客在春节别具一格吧。
效果
方法
<link rel="stylesheet" type="text/css" href="../assets/css/deng.css">
注意:将文件下载到自己博客使用
https://gorpeln.top/assets/css/deng.css
html代码
<!-- 春节灯笼 -->
<div style="display:none;" id="lanterns">
<div class="deng-box">
<div class="deng">
<div class="xian"></div>
<div class="deng-a">
<div class="deng-b">
<div class="deng-t">快乐</div>
</div>
</div>
<div class="shui shui-a">
<div class="shui-c"></div>
<div class="shui-b"></div>
</div>
</div>
</div>
<div class="deng-box1">
<div class="deng">
<div class="xian"></div>
<div class="deng-a">
<div class="deng-b">
<div class="deng-t">新春</div>
</div>
</div>
<div class="shui shui-a">
<div class="shui-c"></div>
<div class="shui-b"></div>
</div>
</div>
</div>
</div>
<!-- 春节灯笼 -->
<script>
document.addEventListener("DOMContentLoaded", function() {
// 获取当前日期
var currentDate = new Date();
// 定义开始日期和结束日期
var startDate = new Date('2025-01-22');//腊月廿三
var endDate = new Date('2025-02-12');//正月十五
// 获取 div 元素
var specialDiv = document.getElementById('lanterns');
// 检查当前日期是否在指定的日期范围内
if (currentDate >= startDate && currentDate <= endDate) {
// 如果在范围内,则显示 div
specialDiv.style.display = 'block';
} else {
// 否则,隐藏 div
specialDiv.style.display = 'none';
}
});
</script>