《回家的路》（祝大家新年快乐）
<style>#papa { margin: 0 0 0 calc(50% - 681px); width: 1200px; height: 740px; box-shadow: 3px 3px 20px #000; background: url('https://pic.imgdb.cn/item/658fadefc458853aef738911.jpg') no-repeat center/cover; position: relative; display: grid; place-items: center; overflow: hidden; z-index: 1; }
#papa video { position: absolute; width: 100%; height: 810px; top: -70px; opacity: .85; object-fit: cover; pointer-events: none; mix-blend-mode: screen; }
#mydiv {
position: absolute;
left: 100px;
top: 400px;
padding: 6px;
width: fit-content;
border: 4px solid rgba(0,0,0,.15);
border-radius: 6px;
background: rgba(100,100,100,.2);
box-shadow: 4px 4px 16px rgba(0,0,0,.25);
}
#rlTop {
display: flex;
gap: 6px;
background: #ccc;
padding: 10px;
border-radius: 10px 10px 0 0;
}
#today {
text-align: right;
cursor: pointer;
user-select: none;
}
#rili {
width: 210px;
display: flex;
flex-direction: row;
flex-wrap: wrap;
background: #eee;
border-radius: 0 0 10px 10px;
}
.tbox {
width: 30px;
height: 30px;
text-align: center;
font: normal 16px/40px sans-serif;
}
</style>
<div id="papa">
<video id="vid" src="https://img.tukuppt.com/video_show/2475824/00/01/59/5b46b977d9e77.mp4" autoplay loop muted></video>
<div id="mydiv">
<div id="rlTop">
<select id="sYear"></select>
<select id="sMonth"></select>
<span id="today" title="今日日历">今日</span>
</div>
<div id="rili"></div>
</div>
</div>
<script>
(function() {
let sf = document.createElement('script');
sf.src = 'https://638183.freep.cn/638183/web/api/ypPlayer.min.js';
sf.charset = 'utf-8';
document.body.appendChild(sf);
sf.onload = () => {
let player = new ypP();
player.setAudSrc('https://music.163.com/song/media/outer/url?id=2091979975');
player.setBtnCss(`
width: 300px;
bottom: 50px;
--btnBg: url('https://pic.imgdb.cn/item/658fbbadc458853aefa56c63.png') no-repeat center/cover;
--trackBg: linear-gradient(to right, hsla(38, 100%, 82%, .35), hsla(34, 100%, 63%, 0.25), hsla(34, 100%, 63%, 0.25));
--progBg: #F4A460;
--btnSize: 50px;
`);
player.setLrcCss('top: 80px; color: #E6E9E6; --bg: linear-gradient(rgba(255,236,199,.25),rgba(255,164,36,.9));');
player.lrcAr = [
,
,
,
,
,
,
,
,
,
,
,
,
,
,
,
,
,
,
,
,
,
,
,
,
,
,
,
,
,
,
,
,
,
,
,
,
];
};
let thisYear = new Date().getFullYear();
let thisMonth = new Date().getMonth();
let thisDay = new Date().getDate();
let m1stDay = (y,m) => new Date(y, m).getDay();
let mAllDays = (y,m) => new Date(y, m + 1, 0).getDate();
let calendar = (year,month) => {
let ar = '日一二三四五六'.split('').map(c => `<div class="tbox">${c}</div>`);
let output = ar.join('');
let d = new Date(year,month);
let y = d.getFullYear(), m = d.getMonth();
let alldays = mAllDays(y,m);
let firstday = m1stDay(y,m);
Array.from({length: alldays + firstday}).forEach((item,key) => {
let idx = key < firstday ? '' : (key - firstday + 1);
if(idx == thisDay && month == thisMonth && year == thisYear)
idx = `<span style="color:red">${idx}</span>`;
output += `<div class="tbox">${idx}</div>`;
});
rili.innerHTML = output;
};
let mkYear = () => {
let ar = [...new Array(10).keys()].map(item => item + 2018);
ar.forEach((y,k) => {
let selected = y == new Date().getFullYear() ? 'selected' : '';
sYear.innerHTML += `<option ${selected} value="${y}">${y}年</option>`;
});
};
let mkMonth = () => {
Array.from({length: 12}).forEach((m,k) => {
let selected = k === new Date().getMonth() ? 'selected' : '';
sMonth.innerHTML += `<option ${selected} value="${k}">${k + 1}月</option>`;
});
};
sYear.onchange = sMonth.onchange = () => calendar(sYear.value,sMonth.value);
today.onclick = () => {
sYear.value = thisYear;
sMonth.value = thisMonth;
calendar(thisYear,thisMonth);
};
calendar(thisYear,thisMonth);
mkYear();
mkMonth();
})();
</script> 把黑黑的JS日历放帖子里了，这样可以数着日子过节了{:4_173:}@马黑黑 这个日历真还，每次打开帖子都可以看到当前的日子。
今年除夕不放假，早早策划好回去的路吧，有钱没钱回家过年{:4_204:} 元旦马上到了，接下来就是数着日子等过年了{:4_205:} https://img0.baidu.com/it/u=887301421,2647868622&fm=253&fmt=auto&app=138&f=JPEG 红影 发表于 2023-12-30 22:20
把黑黑的JS日历放帖子里了，这样可以数着日子过节了@马黑黑
日历没拷贝全吧，无论怎么选择都只有这个月的日历呀。 回家过年，一路平安！ 师妹信手拈来都是美贴呵，学霸呀1{:4_187:}
谢谢花潮论坛，谢谢红影管理员。
祝红影管理员新年快乐、万事遂心！
借红影管理员美帖祝福花潮朋友们新年快乐！
红影 发表于 2023-12-30 22:20
把黑黑的JS日历放帖子里了，这样可以数着日子过节了@马黑黑
要得要得{:4_189:} 起个网名好难 发表于 2023-12-31 08:25
谢谢难难{:4_187:} 起个网名好难 发表于 2023-12-31 08:28
日历没拷贝全吧，无论怎么选择都只有这个月的日历呀。
我也不知道怎么回事，拷贝全了啊。等空了我再看看{:4_187:} 醉美水芙蓉 发表于 2023-12-31 08:47
欣赏学习红影美女精彩音画！
多谢水芙蓉美女鼓励{:4_187:} 樵歌 发表于 2023-12-31 09:17
回家过年，一路平安！
其实这个帖子适合过年。我是想试验一下那个日历，就做了这个{:4_173:} 樵歌 发表于 2023-12-31 09:18
师妹信手拈来都是美贴呵，学霸呀1
我也是在学习啊，师兄谬赞了{:4_173:} 梦油 发表于 2023-12-31 09:27
谢谢花潮论坛，谢谢红影管理员。
祝红影管理 ...
谢谢梦油，也祝梦油新年快乐，万事如意{:4_187:} 马黑黑 发表于 2023-12-31 10:33
要得要得
想请教黑黑两个问题：1、歌词是怎样缩进排列的？我跑你那找到Web代码格式化工具，好像只能打开，不能缩起来啊。 2、就是帖子里的时间不能换呢。 红影 发表于 2023-12-31 15:44
谢谢梦油，也祝梦油新年快乐，万事如意
谢谢，谢谢！ 祝福影子和论坛所有的兄弟姐妹们新年快乐！ 万事顺意！{:4_187:}{:4_187:}{:4_187:}