源码小屋

凡哥

花简静 发表于 2024-7-28 22:44
太会过日子了。。

经济低迷，勒紧裤带过日子

凡哥

2024年7月29日 星期一

Teyata

<style>
.tiezi {
	margin: 30px 0 30px calc(50% - 570px);
	width: 960px;
	height: 600px;
	box-sizing: border-box;
	border: 3px solid;
	border-image: linear-gradient(to top right, orange, green, red, cyan) 3 3;
	background: url('https://638183.freep.cn/638183/t24/1/teyata.jpg') no-repeat center/cover;
	z-index: 1;
	pointer-events: none;
	position: relative;
}
.tiezi::before, .tiezi::after {
	 position: absolute;
	 content: '';
	 transition: all .45s;
}
.tiezi::before {
	inset: 0;
	background: rgba(255, 255, 255, 0.35);
	backdrop-filter: hue-rotate(var(--hue));
}
.tiezi::after {
	right: 260px;
	top: 120px;
	width: 50px;
	height: 50px;
	background: url('https://638183.freep.cn/638183/web/svg/flower_1.svg') no-repeat center/cover;
	transform: rotate(var(--hue));
	pointer-events: auto;
	cursor: pointer;
}
.tiezi:hover::before { backdrop-filter: unset; }
</style>

<div class="tiezi" id="tzi">
	<!-- Teyata -->
	<audio id="aud" src="https://music.163.com/song/media/outer/url?id=17360999" autoplay loop></audio>
</div>

<script>
aud.ontimeupdate = () => tzi.style.setProperty('--hue', Math.floor(Math.random() * 360) + 'deg');
tzi.onclick = () => aud.paused ? aud.play() : aud.pause();
</script>

花简静

凡哥 发表于 2024-7-29 08:02
经济低迷，勒紧裤带过日子

难怪奥运会跟玩似的。。全球都酱紫啊。

凡哥

花简静 发表于 2024-7-29 09:07
难怪奥运会跟玩似的。。全球都酱紫啊。

疫情的影响还在延续

花简静

凡哥 发表于 2024-7-29 13:35
疫情的影响还在延续

挺深远的影响。。

凡哥

花简静 发表于 2024-7-29 16:08
挺深远的影响。。

都影响到火星那么去了

花简静

凡哥 发表于 2024-7-29 18:36
都影响到火星那么去了

星际级别的呀。。这事儿可大了。

凡哥

花简静 发表于 2024-7-29 18:52
星际级别的呀。。这事儿可大了。

说大也大

花简静

凡哥 发表于 2024-7-29 20:46
说大也大

说不大也还好

凡哥

花简静 发表于 2024-7-29 21:46
说不大也还好

合适就好