这个飞碟不会动啊{:4_173:}
好创意！画面非常震撼 {:5_116:}赞！ 队长真棒！ 周末快乐！
{:4_204:}{:4_179:}
大猫咪 发表于 2022-7-10 10:26
好创意！画面非常震撼 赞！ 队长真棒！ 周末快乐！
猫猫上午好。{:4_179:}
本帖最后由 加林森 于 2022-9-2 18:41 编辑 <br /><br />红影 发表于 2022-7-10 09:00
这个飞碟不会动啊
这个是老黑的设定，我没有去改，直接制作的。
<style>
#papa { left: -214px; width: 1024px; height: 682px; background: gray url('https://pic.imgdb.cn/item/6311dba416f2c2beb10c2b59.jpg') no-repeat center/cover; box-shadow: 3px 3px 20px #000; display:grid; place-items: center; user-select: none; overflow: hidden; position: relative; z-index: 1; }
#mplayer { position: absolute; right: 20px; top: 20px; width: fit-content; height: fit-content; display: flex; align-items: center; gap: 8px; z-index: 9; }
#btnwrap { position: relative; width: 36px; height: 36px; display: grid; place-items: center; border-radius: 50%; background: #ccc linear-gradient(to top right, rgba(255,0,0,.75), rgba(0,255,0,.75)); cursor: pointer; }
#btnwrap:hover { background: #000 linear-gradient(to top right, rgba(255,0,0,.75), rgba(0,255,0,.75)); }
#btnplay { width: 20px; height: 20px; background: #ccc; clip-path: polygon(0 0, 0% 100%, 100% 50%); }
#btnpause { width: 2px; height: 20px; border-style: solid; border-width: 0px 4px; border-color: transparent #eee; display: none; }
#prog { width: 300px; height: 2px; background: #ccc linear-gradient(to right,red,orange,green,tomato) no-repeat; background-size: 1px 2px; cursor: pointer; position: relative;}
#prog::before { position: absolute; content: ''; top: -7px; width: inherit; height: 15px; }
#prog:hover::before { background: rgba(0,200,200,.15); }
#tmsg { font: normal 16px sans-serif; color: lightblue;}
#lrc { position: absolute;right: 100px; top: 60px; font: bold 1.5em sans-serif; color:#483D8B； lightblue; text-shadow: 1px 1px 2px #000; text-align: center; }
#lrc:hover, #FFFAFA:hover { color: snow; }
#vid { position: absolute; width: 1024px; height: 720px; top: -55px; object-fit: cover;opacity: .25; }
</style>
<div id="papa">
<video id="vid" src="https://img.tukuppt.com/video_show/15653652/00/80/83/60d0445e4511e.mp4" muted="muted" autoplay="autoplay" loop="loop"></video>
<div id="mplayer"><span id="btnwrap"><span id="btnplay"></span><span id="btnpause"></span></span><span id="prog"></span><span id="tmsg">00:00 | 00:00</span></div>
<div id="lrc">lrc歌词</div>
</div>
<script>
let lrcAr = [
['00.00','下雨天 - 与少年他/芝麻Mochi'],
['14.60','下雨天了怎么办 我好想你'],
['21.73','不敢打给你 我找不到原因'],
['29.03','为什么失眠的声音'],
['32.83','变得好熟悉'],
['36.04','沉默的场景 做你的代替'],
['39.79','陪我等雨停'],
['44.37','期待让人越来越沉溺'],
['51.37','谁和我一样'],
['53.83','等不到他的谁'],
['58.63','爱上你我总在学会'],
['62.89','寂寞的滋味'],
['65.78','一个人撑伞 一个人擦泪'],
['69.23','一个人好累'],
['72.53','怎样的雨 怎样的夜'],
['76.03','怎样的我能让你更想念'],
['79.90','雨要多大'],
['81.50','天要多黑 才能够有你的体贴'],
['87.56','其实 没有我你分不清那些'],
['90.97','差别 结局还能多明显'],
['94.34','别说你会难过'],
['97.41','别说你想改变'],
['102.49','被爱的人不用道歉'],
['138.47','期待让人越来越疲惫'],
['145.57','谁和我一样'],
['149.62','等不到他的谁'],
['154.31','爱上你我总在学会'],
['157.19','寂寞的滋味'],
['160.04','一个人撑伞 一个人擦泪'],
['163.51','一个人好累'],
['166.84','怎样的雨 怎样的夜'],
['170.44','怎样的我能让你更想念'],
['174.18','雨要多大'],
['175.88','天要多黑 才能够有你的体贴'],
['181.76','其实 没有我你分不清那些'],
['185.57','差别 结局还能多明显'],
['189.14','别说你会难过'],
['191.69','别说你想改变'],
['196.69','被爱的人不用道歉'],
['202.15','怎样的雨 怎样的夜'],
['205.67','怎样的我能让你更想念'],
['209.26','雨要多大'],
['210.96','天要多黑 才能够有你的体贴'],
['216.84','其实 没有我你分不清那些'],
['220.54','差别 结局还能多明显'],
['224.32','别说你会难过'],
['226.79','别说你想改变'],
['231.92','被爱的人不用道歉']
];
let aud = new Audio();
aud.src = 'https://music.163.com/song/media/outer/url?id=1426112587.mp3';
aud.autoplay = true;
aud.loop = true;
btnwrap.onclick = () => aud.paused ? aud.play() : aud.pause();
prog.onclick = (e) => aud.currentTime = aud.duration * e.offsetX / prog.offsetWidth;
aud.addEventListener('pause', () => btnstate());
aud.addEventListener('play',() => btnstate());
aud.addEventListener('timeupdate', () => {
prog.style.backgroundSize = prog.offsetWidth * aud.currentTime / aud.duration + 'px 2px';
tmsg.innerText = toMin(aud.duration) + ' | ' + toMin(aud.currentTime);
for(j=0; j<lrcAr.length; j++) {
if(aud.currentTime >= lrcAr) lrc.innerText = lrcAr;
}
});
let btnstate = () => aud.paused ? (btnplay.style.display = 'block', btnpause.style.display = 'none') : (btnplay.style.display = 'none', btnpause.style.display = 'block');
let toMin = (val)=> {
if (!val) return '00:00';
val = Math.floor(val);
let min = parseInt(val / 60), sec = parseFloat(val % 60);
if(min < 10) min = '0' + min;
if(sec < 10) sec = '0' + sec;
return min + ':' + sec;
}
</script>
红影 发表于 2022-7-10 09:00
这个飞碟不会动啊
原本会的，队长觉得球球不好玩，不让它动。东篱才是爱玩球的，队长喜欢玩鹰。
加林森 发表于 2022-7-10 11:02
猫猫上午好。
队长来了{:4_179:}
我想起了赵忠祥。赵忠祥主持的“动物世界”给我留下了深刻的印象。
大猫咪 发表于 2022-7-10 11:21
队长来了
来了来了。{:4_179:}
梦油 发表于 2022-7-10 11:21
我想起了赵忠祥。赵忠祥主持的“动物世界”给我留下了深刻的印象。
这个就是原版的开头曲。
队长这个飞碟不能飞？
加林森 发表于 2022-7-10 11:04
这个是老黑的设定，我没有去改，直接制作的。
队长这个直接套用黑黑，本来飞碟就不飞的？
看起来我许多帖没有看见了
小辣椒 发表于 2022-7-10 11:35
队长这个飞碟不能飞？
本来可以飞的。拿给就不让飞了。{:4_189:}
加林森 发表于 2022-7-10 11:32
这个就是原版的开头曲。
美好的回忆——中央电视台的“动物世界”。
梦油 发表于 2022-7-10 13:18
美好的回忆——中央电视台的“动物世界”。
是的。中央三台的。
加林森 发表于 2022-7-10 14:09
是的。中央三台的。
看来，你也很喜欢这个栏目。
梦油 发表于 2022-7-10 14:14
看来，你也很喜欢这个栏目。
我原来经常看这个节目的。
加林森 发表于 2022-7-10 14:23
我原来经常看这个节目的。
我也经常看“动物世界”，不过，那是在赵忠祥主持这个节目的时候。
梦油 发表于 2022-7-10 15:05
我也经常看“动物世界”，不过，那是在赵忠祥主持这个节目的时候。
是的。
加林森 发表于 2022-7-10 16:12
是的。
后来的“动物世界”，我就没怎么看。
梦油 发表于 2022-7-10 19:56
后来的“动物世界”，我就没怎么看。
我看世界奇观。