【漫步特效】我总是等你TO：风晴雪 生日快乐！（人物开眼闭眼＋人物叠加）

云端漫步

云端漫步

@风晴雪 @一鹿向北
晴儿忽视标题哦，昨晚制作的送你生日快乐！

云端漫步

@若依 @清梦 @花简静 @令狐冲 @玫の玫 @云笛 @泪红颜 @淥の詶 @向荣S @轻舞若芸 @素心
@星的祝福

云端漫步

要学习代码的可套用，这代码是明码，代码我写清楚了，发表时去除所有中文行如：/* 可根据需要调整透明度 */。你可照着做。
代码多数是英文与数字组成，如中文嵌入数据流慢打开图就慢切记。

1. <style>
   
2. /* 人物闭眼开眼动画  */
   
3. .character {
   
4.     position: absolute;
   
5.     width: 1700px;
   
6.     height: 850px;
   
7.     top: 0;
   
8.     left: 0;
   
9.     opacity: 0;
   
10.     z-index: 2; /* 人物图层级高于视频 */
    
11.     animation: fadeInOut 2s infinite; /* 周期缩短为2秒 */
    
12. }
    
13. 
    
14. #char1 {
    
15.     background: url('https://kkshan.com/data/attachment/forum/202511/01/143022dh1o0xyya1okxawj.png') no-repeat center/cover;
    
16.     animation-delay: 0s;/* 人物开眼图 */
    
17. }
    
18. 
    
19. #char2 {
    
20.     background: url('https://kkshan.com/data/attachment/forum/202511/01/143022qf4cpoizfgo92if2.png') no-repeat center/cover;/* 人物闭眼图 */
    
21.     animation-delay: 1s; /* 延迟1秒（周期的一半）交替显示 */
    
22. }
    
23. 
    
24. /* 调整人物闭眼开眼关键帧，让淡入淡出更迅速 */
    
25. @keyframes fadeInOut {
    
26.     0%, 100% { opacity: 0; }
    
27.     20%, 80% { opacity: 1; } /* 缩短完全显示的时间，加快过渡 */
    
28. }
    
29. 
    
30. #mydiv {
    
31.     margin: 30px 0 30px calc(50% - 931px);
    
32.     display: grid;
    
33.     place-items: center;
    
34.     width: 1700px;
    
35.     height: 850px;
    
36.     background: lightblue url('https://kkshan.com/data/attachment/forum/202510/30/132423ceatlbl4az2be1ac.jpg') no-repeat center/cover;/* 背景图 */
    
37.     box-shadow: 3px 3px 20px #000;
    
38.     user-select: none;
    
39.     overflow: hidden;
    
40.     position: relative;
    
41.     z-index: 1;  
    
42. }
    
43. #vid {
    
44.     position: absolute;
    
45.     width: 120%;
    
46.     height: 120%;
    
47.     object-fit: cover;
    
48.     pointer-events: none;
    
49.     mix-blend-mode: screen;
    
50.       mask: linear-gradient(to top right, red 88%, transparent 0);   
    
51.     -webkit-mask: linear-gradient(to top right, red 88%, transparent 0);   
    
52.     z-index: 1.5; /* 视频层级低于人物图 */
    
53.     opacity: .35;
    
54. }
    
55. </style>
    
56.   
    
57. <div id="mydiv">
    
58.     <video id="vid" src="https://img.tukuppt.com/video_show/2402760/00/01/83/5b4ab6a4d08c4.mp4" autoplay="" loop="" muted=""></video>
    
59.     <div id="char1" class="character"></div>
    
60.     <div id="char2" class="character"></div>
    
61.     <audio id="aud" src="https://ting8.yymp3.com/new11/wansuxia3/8.mp3" autoplay loop></audio>
    
62. </div>

复制代码

风晴雪

漫步老师谢谢你送我的生日祝福
整体采用暖色调的渐变背景
营造出复古又文艺的感觉
和画面中的人物气质很契合
人物与文字的布局平衡
左侧的歌词竖排排列
既不抢镜又能引导视线
右侧的人物姿态自然
头顶的杂志封面
增加了画面的趣味性和艺术感
人物的光影柔和自然
杂志上的细节清晰可见
字体的选择和排版也很有设计感
歌词内容与画面风格相呼应
传达出一种深情与等待的氛围
让人在视觉和情感上
都能感受到那份细腻的情感
这张图的制作不仅美观
还能很好地传达出
歌曲的情感非常出色
尤其是特效眨眼的特效太好看了
感谢漫步老师的精心制作

风晴雪

再一次感谢漫步老师的真诚祝福
晴儿收藏了礼物谢谢你

泪红颜

哇哦，漫步老师这图好美，特效闪烁缤纷灿烂的，人物眼睛还能眨巴眨巴呢
背景的照片墙温馨甜蜜~
欣赏学习漫步老师精美作品，问好漫步老师~

泪红颜

跟祝晴儿生日快乐收礼开心~

风晴雪

泪红颜 发表于 2025-11-1 15:00
跟祝晴儿生日快乐收礼开心~

谢谢泪宝宝

一鹿向北

这个背景很文艺呢，人素选的也不错，主题排字精彩，
大眼睛也是忽闪忽闪的，
祝晴儿生日快乐！
这主题我来说好了，我总是等晴儿呗。