【黑师代码】我知道风从哪个地方来（学习黑师20250805《真实与谎言》花形小播效果）
<style>@import 'https://638183.freep.cn/638183/web/css/tz01.css';
#pa { --offsetX: 0px; margin: 160px 0; left: calc(50% - 81px); transform: translateX(-50%); width: clamp(600px, 90vw, 1700px); height: auto; aspect-ratio: 17/9;--bg: url('https://642303.freep.cn/642303/tu/20250805tt.webp') no-repeat center/cover; --ma-size: 100%; }
.wrap { position: absolute; bottom: 200px; aspect-ratio: 1/1; width: 6%; left:11%;top:63%;filter: drop-shadow(0 240px 10px rgba(0,0,0,.5)); }
.son { position: absolute; top: 40%; width: 50%; height: 10%; background: linear-gradient(75deg, #a4939f, snow, #7b7c96); border-radius: 100% 0; box-shadow: 0 0 200px cyan; transform-origin: 100% 100%; }
#btnFs { right: 20px; top: 20px; color: #978894; }
.qk-vid{mix-blend-mode:overlay;opacity: .40;}
</style>
<div id="pa">
<audio id="aud" src="https://music.163.com/song/media/outer/url?id=1448750854" autoplay loop></audio>
<video class="qk-vid" src="https://bpic.588ku.com/video_listen/588ku_video/22/11/05/13/11/43/video6365f08f780f8.mp4" autoplay loop muted></video>
<div class="wrap">
<div id="ma" class="hue-rotate"></div>
</div>
</div>
<script type="module">
import { FS } from 'https://638183.freep.cn/638183/web/js/fullscreen.js';
FS(pa, ma);
const tt = 12;
Array.from({length: tt}).forEach( (s, k) => {
s = document.createElement('span');
s.className = 'son';
s.style.setProperty('transform', `rotate(${360 / tt * k}deg) translate(-8px)`);
ma.appendChild(s);
});
</script>
@马黑黑 白老师来瞧瞧，昨天的小播作业。{:4_173:}
最近没做带歌词的，没留意这个封装代码有没有封歌词，我去瞅瞅。。 赏图听歌，问好花飞飞老师{:4_204:} 朵拉 发表于 2025-8-6 10:28
赏图听歌，问好花飞飞老师
朵拉好久不见，想你啦{:4_187:} 这小播用得巧妙，还起到了美化文字设计的效果。
欣赏飞飞好帖{:4_199:} 花飞飞 发表于 2025-8-6 09:08
@马黑黑 白老师来瞧瞧，昨天的小播作业。
最近没做带歌词的，没留意这个封装代码有没有封歌词， ...
这个不带歌词同步 红影 发表于 2025-8-6 11:26
这小播用得巧妙，还起到了美化文字设计的效果。
欣赏飞飞好帖
问好影子，这个小播有立体感，特别好看{:4_187:} 马黑黑 发表于 2025-8-6 12:32
这个不带歌词同步
好哒，新的封包感觉新东西很多。。翻出一个是惊喜，又翻出一个是宝贝{:4_170:} 漂亮，谢谢花飞飞精彩分享{:4_204:} 花飞飞 发表于 2025-8-6 18:01
好哒，新的封包感觉新东西很多。。翻出一个是惊喜，又翻出一个是宝贝
那么夸张 马黑黑 发表于 2025-8-6 20:52
那么夸张
{:4_173:}缺了一个月的 课，不知道这个封包的原散装在哪里 杨帆 发表于 2025-8-6 20:42
漂亮，谢谢花飞飞精彩分享
感谢杨帆支持哦{:4_190:} 花飞飞 发表于 2025-8-6 17:59
问好影子，这个小播有立体感，特别好看
是啊，尤其这颜色配置，特别适合这样的背景{:4_199:} 红影 发表于 2025-8-6 21:31
是啊，尤其这颜色配置，特别适合这样的背景
嗯哪，色彩是取的背景上的原色搭的。。{:4_187:} 花飞飞 发表于 2025-8-6 21:44
嗯哪，色彩是取的背景上的原色搭的。。
这样的细节处理更是出彩之处{:4_187:}
页:
[1]