【漫步幻影粒子特效】弦丝万缕.TO：念若莲

念若莲

玫の玫 发表于 2026-6-28 21:21
祝莲收礼开心快乐，夏日愉快！

谢谢玫玫，夏日好

云端漫步

花茶（永） 发表于 2026-6-29 10:02
飘浮的字和灯效好看！分享代码出来吧

代码在帖中，代码很简单就两个视频，一个幻影粒子特效视频，一个熊猫视频一张背景图和标题PNG图片，幻影粒子特效要用幻影粒子软件制作你可能不会做。

1. <style>
   
2. #mydiv {
   
3.     margin: 150px 0 10px calc(50% - 900px);
   
4.     width: 1700px;
   
5.     height: 850px;
   
6.     background: lightblue url('https://i.uik.cc/view.php/b31e18b14615f95a35821a43c51a1687.jpg') no-repeat center/cover;
   
7.     box-shadow: 3px 3px 20px #000;
   
8.     user-select: none;
   
9.     overflow: hidden;
   
10.     position: relative;
    
11.     z-index: 1;  
    
12. }
    
13. #vid {
    
14.     position: absolute;
    
15.     width: 130%;
    
16.     height: 130%;
    
17.     object-fit: cover;
    
18.     pointer-events: none;
    
19.     mix-blend-mode: screen;
    
20.     mask: linear-gradient(to top right, red 88%, transparent 0);   
    
21.     -webkit-mask: linear-gradient(to top right, red 88%, transparent 0);   
    
22.     z-index: 3;
    
23.     opacity: .20;
    
24. }
    
25. #new-vid {
    
26.     position: absolute;
    
27.     top: -100px;
    
28.     left: 0;
    
29.     width: 100%;
    
30.     height: calc(100% + 100px);
    
31.     object-fit: cover;
    
32.     pointer-events: none;
    
33.     z-index: 2;
    
34.     opacity: 0.99;
    
35.     mix-blend-mode: normal;
    
36.     mask: none;
    
37.     -webkit-mask: none;
    
38. }
    
39. #top-png {
    
40.     position: absolute;
    
41.     width: 100%;
    
42.     height: 100%;   
    
43.     object-fit: cover;
    
44.     pointer-events: none;
    
45.     z-index: 5;
    
46.     opacity: 1;
    
47. }
    
48. video::-webkit-media-controls {
    
49.     display: none !important;
    
50. }
    
51. video {
    
52.     -webkit-appearance: none;
    
53. }
    
54. </style>
    
55. <div id="mydiv">
    
56.     <audio id="aud" src="https://mp3.joy127.com/music/12900.mp3" autoplay loop></audio>
    
57.     <video id="new-vid" src="https://i.uik.cc/view.php/75d87cb3c095942951bc3b2f717fb5ef.mp4" autoplay loop muted playsinline></video>
    
58.     <video id="vid" src="https://img2.tukuppt.com/video_show/15653652/01/33/56/62eca412c514b.mp4"autoplay="" loop="" muted=""></video>
    
59.     <img id="top-png" src="https://i.uik.cc/view.php/2709ef4d2a5ce24e8f9704d0626686ef.png" alt="PNG">
    
60. </div>
    
61. </div>

复制代码

云端漫步

圊圊淥詶 发表于 2026-6-29 09:04
漫步老师一直有特效分享给大家，很好看，~~
辛苦了，新周快乐~~

淥詶很忙吧，看你很少上来，你唱歌好听喜欢。

花茶（永）

云端漫步 发表于 2026-6-29 14:29
代码在帖中，代码很简单就两个视频，一个幻影粒子特效视频，一个熊猫视频一张背景图和标题PNG图片，幻影 ...

真不会做，谢谢

欧阳风刀

特效丰富多彩，漫步兄好制作，祝若莲收礼愉快。

云端漫步

欧阳风刀 发表于 2026-6-29 21:11
特效丰富多彩，漫步兄好制作，祝若莲收礼愉快。

谢谢风刀临帖支持。