【黑师代码】等风与你（学习黑师20250326《爱河》歌词横竖切换效果）
<style>@import 'https://638183.freep.cn/638183/web/ku/yslrc_range_player2in1.css';
#papa { margin: 130px 0 30px calc(50% - 931px);width: 1700px;height: 1600px;background: #131C1E url('https://642303.freep.cn/642303/tu/20250326dfg01.webp') no-repeat center / cover; border-radius: 6px; overflow: hidden; }
#papa::after { position: absolute; content: ''; width: 100%; height: 100%; border-image: linear-gradient(45deg,#6f5c53,#513e3a, #2a1f1c) 10 / 4px round; }
#mplayer { --prog: snow; --track: tan; bottom: 20px; width: 40%;opacity: .32;}
#lrcDiv {--hlcolor:#5f3c29; color: #6f5c53; top: 22%; right:180px;writing-mode: vertical-rl; text-shadow: 1px 1px 1px rgba(0,0,0,.5); }
#fsbtn { top: 60px; }
#flower { position: absolute; top: 300px; right: 360px; width: 120px; cursor: pointer; z-index: 4; animation: rot 8s linear infinite var(--state); opacity: .32; }
.vid {
position: absolute;
width: 100%;
height: 130%;
bottom:-280px;
opacity: .33;
object-fit: cover;
mask: radial-gradient(transparent 30%, red);
-webkit-mask: radial-gradient(transparent 30%, red);
pointer-events: none;
}
</style>
<div id="papa" class="pa">
<video class="vid" src="https://bpic.588ku.com/video_listen/588ku_video/24/06/25/09/05/34/video667a17de59867.mp4" autoplay loop muted></video>
<img id="flower" src="https://638183.freep.cn/638183/small/f002.png" alt="" title="Alt+X" />
<audio src="https://music.163.com/song/media/outer/url?id=1378196362" autoplay loop></audio>
</div>
<script type="module">
import { hcplay } from 'https://638183.freep.cn/638183/web/ku/yslrc_range_player2in1.js';
var geci = `
单曲：等风与你
电影《战玄武》宣传曲
歌手：小时姑娘
作词 : 明宸
作曲 : 森水垚
作曲/编曲：三火
作词：Ming.明
和声编写/伴唱：阿南
混音/母带：杨尚衡
海报：蜘向镜ALine
月明星稀 拂去尘衣
遥望天地 好似你的眉宇
清风起扇起涟漪 是谁动情欲
将往昔当作秘密 绝口不提
原来感情 真的苟如蝼蚁
满目疮痍 心都随你而去
从此我整日沉溺 算得上入戏
局中迷或不如意 不论悲喜
白沉暮辞无别时 我愿等风也等你
梦中忽而寻觅
莫恐惧两相疑
我们也曾为胶漆
而如今惊闻于鹤唳
愿贪得月色旖旎 相赠与你
妙手素医 去我心头之疾
恹恹扶柳 拘泥择木而栖
莫不是风流成倜也不能自律
掌心抵上下而衍生生不息
白沉暮辞无别时我愿等风也等你
梦中忽而寻觅
莫恐惧两相疑
我们也曾为胶漆
而如今惊闻于鹤唳
愿贪得月色旖旎相赠与你
白沉暮辞无别时我在等风也等你
梦中忽而寻觅莫恐惧两相疑
我们也曾为胶漆
而如今惊闻于鹤唳
愿贪得月色旖旎相赠与你
`;
hcplay(papa, geci, 7);
flower.onclick = () => btnPlay.click();
</script>
@马黑黑 前天是调不好，昨天没来成。现在把作业发出来。。。
歌词我断句了，梦中和恐惧，一直还叠着。。
其实我还试了在两个字中间加个空格，它居然也能叠，我也是醉了。。
{:4_173:}不是代码的事，也不是长句子的事。。是我电脑浏览器的事儿。。 欣赏老师漂亮的大图音画。问好！{:4_187:} 字体设计真美，在字体下还有个挂坠呢，那朵小花的位置设置也美。字体的颜色和歌词同步颜色也用心调整过。
欣赏飞飞好帖{:4_199:} 没看到有重叠的字啊，为了这个还从头看到尾，还是没看到重叠的字{:4_173:} 图片的意境十分好，视频配得也极协调，飞飞的制作效果十分完美，太赞了{:4_199:} 花飞飞 发表于 2025-3-29 09:59
@马黑黑 前天是调不好，昨天没来成。现在把作业发出来。。。
歌词我断句了，梦中和恐惧，一直还叠着。。
...
我一直没有看到有叠字 花飞飞 发表于 2025-3-29 09:59
不是代码的事，也不是长句子的事。。是我电脑浏览器的事儿。。
啥浏览器呢 梦江南 发表于 2025-3-29 10:38
欣赏老师漂亮的大图音画。问好！
问好梦江南，感谢支持{:4_187:} 红影 发表于 2025-3-29 11:07
字体设计真美，在字体下还有个挂坠呢，那朵小花的位置设置也美。字体的颜色和歌词同步颜色也用心调整过。
...
影子支持一如既往十分给力{:4_173:} 红影 发表于 2025-3-29 11:08
没看到有重叠的字啊，为了这个还从头看到尾，还是没看到重叠的字
{:4_170:}一分二十秒左右。这已切成短句子了。
红影 发表于 2025-3-29 11:08
图片的意境十分好，视频配得也极协调，飞飞的制作效果十分完美，太赞了
感谢影子鼓励，看着就开心{:4_187:} 马黑黑 发表于 2025-3-29 19:43
我一直没有看到有叠字
还有一张，就这两个词。。{:4_170:}
估计显示器和显卡不行。要换了
马黑黑 发表于 2025-3-29 19:43
啥浏览器呢
试了Edge和火狐两个都叠就不想试了。{:4_173:} 花飞飞 发表于 2025-3-29 20:32
试了Edge和火狐两个都叠就不想试了。
怎么会？ 花飞飞 发表于 2025-3-29 20:31
还有一张，就这两个词。。
估计显示器和显卡不行。要换了
不是这方面的原因。你可以清除缓存、恢复默认设置（后续再做个性化设置） 马黑黑 发表于 2025-3-29 20:35
怎么会？
{:4_170:}
我常用的是这两个的。
试过了。它就会。。。
有点想揍它。。 马黑黑 发表于 2025-3-29 20:37
不是这方面的原因。你可以清除缓存、恢复默认设置（后续再做个性化设置）
别的没影响，大家看没问题就行了。。现在我知道它没问题。。{:4_173:} 花飞飞 发表于 2025-3-29 20:41
我常用的是这两个的。
试过了。它就会。。。
有点想揍它。。
横排有木有问题