《法 图 麦》 (DJ版) - 蛋糕姐姐
本帖最后由 亦是金 于 2023-10-25 23:37 编辑 <br /><br /><meta charset="UTF-8"><div class="t_fsz">
<table cellspacing="0" cellpadding="0"><tr><td class="t_f" id="postmessage_1969237">
<div style="width: 1200px;height: 700px;box-shadow:0px 0px 1px 2px #045768, 0px 0px 0px 8px #99e5f5,0px 0px 5px 15px #045768;overflow:hidden;border-radius:1%;margin-top:100px;margin-LEFT: -310px;">
<style>
#papa {
margin: ; width: 1200px; height: 700px;top:-80px; LEFT: 0px;background: url('tooopen_sy_143179554183.jp') no-repeat center/cover; box-shadow: 4px 4px 8px black; overflow: hidden; display: grid; place-items: center; z-index: 1; position: relative; --state: running; }
#vid1 {
position: absolute;
width: 100%;
height: 100%;
left:0%;
bottom:0%;
object-fit: cover;
pointer-events: none;
mix-blend-mode: screen;
z-index: 2;
opacity: .99;
}
#vid2 {
position: absolute;
width: 100%;
height: 110%;
top:0%;
left:0%;
object-fit: cover;
pointer-events: none;
mix-blend-mode: screen;
z-index: 3;
opacity: .99;
}
</style>
<div style="position: relative; width: 500px; height: 50px; top:650px;LEFT: 1000px;z-index: 100; filter: drop-shadow(-1px 1px 1px #e8f552)drop-shadow(0px -1px 1px #e8f552)drop-shadow(0px 0px 1px #e8f552)drop-shadow(0px 0px 1px #e8f552)drop-shadow(0px 0px 1px #e8f552)">
<p><span style="color:#ff0000;"><span style="font-family:华文隶书;"><span style="font-size:24px;">亦是金在线音乐</span></span></span></p></div>
<style type="text/css">
@keyframes mv { from { background-position: 1200px 0; } to { background-position: 0 0; } }
body { overflow-x: hidden; }
#baiBox {
margin: auto;
width: 800px;
text-align: center;
font-family:微软简中圆;
font-size: 2.5rem;
font-weight: bold;
color: #f46ff6;
transform-origin: top;
animation: yao 1.0s linear infinite alternate;
}
@keyframes yao {
from{transform: perspective(800px) rotatex(30deg); }
to { transform: perspective(800px) rotatex(-30deg); }
}
.tit { position: relative;width: 300px;height: 30px;top: -10px;LEFT: -350px;z-index: 100;filter: drop-shadow(-1px 1px 1px #ffffff)drop-shadow(0px -1px 1px #ffffff)drop-shadow(0px 0px 1px #ffffff)drop-shadow(0px 0px 1px #ffffff)drop-shadow(0px 0px 1px #ffffff) }
#tit:hover { color: green; }
/*标题位置 移动范围设置*/
</style>
<div id="hu" >
<div id="baiBox"
<div class="tit">
<span style="color:#fb52f9;"><span style="font-size:36px;">《法 图 麦》 (DJ版) </span>
<span style="color:#3d46f7;"><span style="font-size:26px;"> - - 蛋糕姐姐 </span></div>
</style>
<div id="papa">
<video id="vid1" src="https://imgs-qn.51miz.com/preview/video/00/00/12/73/V-127377-6AFE803F.mp4" autoplay="" loop="" muted=""></video>
<video id="vid2" src="https://imgs-qn.51miz.com/preview/element/00/01/25/25/E-1252550-EA00A6C1.mp4" autoplay="" loop="" muted=""></video>
<audio id="aud" src="https://www.qqmc.com/mp3/music182877848.mp3" autoplay loop></audio>
</div>
<script>
(function() {
let loadJs = (url,callback) => {
let body = document.querySelector('body'), jsNode = document.createElement('script');
jsNode.charset = 'utf-8';
jsNode.setAttribute('src', url);
body.appendChild(jsNode);
jsNode.onload = () => callback();
};
let rippleJs = 'https://638183.freep.cn/638183/web/svg/ripple-min.js',
js1 = 'https://ysj147.s3-us-east-1.ossfiles.com/zzsc/js/svg_path_lrcysj.js',
js2 = 'https://638183.freep.cn/638183/web/lizi/h5lz_02.js';
let lrcAr = [
,
,
,
,
,
,
,
,
,
,
,
,
,
,
,
,
,
,
,
,
,
,
,
,
,
,
,
,
,
,
,
,
,
,
,
,
,
,
,
,
,
,
,
,
,
,
,
,
,
,
,
];
loadJs(rippleJs, () => rippleEffect(papa));
loadJs(js1, () => {
HCPlayer({
papa: '#papa',
lrcAr: lrcAr,
lrc_css: 'bottom: 20px; --bg: linear-gradient(rgba(255,140,240,.35),rgba(250,90,220,.7)); color: #eee;',
fs_css: 'transform: translate(0,-35px); background: transparent;',
player_css: 'width: 350px; height: 360px;top: 59%; left: 78%; ',
path: 'm201.45064,55.5758c13.12914,0 23.72146,-8.69617 23.72146,-19.40932c0,-8.26632 -14.10826,-24.96429 -20.56156,-32.17252c-1.6022,-1.75246 -4.76209,-1.75246 -6.31979,0c-6.4533,7.20823 -20.56156,23.9062 -20.56156,32.17252c0,10.71315 10.59232,19.40932 23.72146,19.40932zm-85.45065,79.35668c23.09838,0 51.3149,-10.87848 54.87534,-26.45223c0.75659,-3.27346 -3.42693,-6.11708 -7.87748,-5.05899c-11.52694,2.74442 -28.66157,4.33155 -46.99786,4.33155s-35.42642,-1.58713 -46.99786,-4.33155c-4.36154,-1.02502 -8.63408,1.75246 -7.87748,5.05899c3.56044,15.57375 31.77696,26.45223 54.87534,26.45223zm57.99073,-55.64887c1.6022,-0.36372 2.67033,-1.48794 2.53682,-2.74442c-1.46868,-13.92048 -14.33079,-23.60861 -24.92311,-23.60861s-23.45442,9.68813 -24.92311,23.60861c-0.13352,1.22342 0.93462,2.3807 2.53682,2.74442c1.55769,0.36372 3.29341,-0.16533 4.13902,-1.22342l4.22803,-5.6211c3.42693,-4.52994 8.54507,-7.1421 14.01925,-7.1421s10.59232,2.61216 14.01925,7.1421l4.22803,5.6211c0.93462,1.19035 2.75934,1.521 4.13902,1.22342zm46.86434,-17.49153c-10.94837,5.19125 -20.47255,4.26542 -20.65057,4.26542c3.07088,6.67919 4.8066,13.82129 4.8066,21.26098c0,36.47101 -39.92148,66.13056 -89.0111,66.13056s-89.0111,-29.65956 -89.0111,-66.13056s39.92148,-66.13056 89.0111,-66.13056c17.71321,0 34.18026,3.9017 48.06599,10.54782c0.75659,-3.1412 2.80385,-7.96873 7.65495,-15.11083c-16.37804,-7.1421 -35.38191,-11.30833 -55.72095,-11.30833c-60.9726,0 -110.37376,36.70246 -110.37376,82.0019s49.40116,82.0019 110.37376,82.0019s110.37376,-36.70246 110.37376,-82.0019c0,-8.92763 -1.95824,-17.49153 -5.51869,-25.5264zm-140.45951,3.50492c5.47418,0 10.59232,2.61216 14.01925,7.1421l4.22803,5.6211c0.93462,1.22342 2.75934,1.55407 4.13902,1.22342c1.6022,-0.36372 2.67033,-1.48794 2.53682,-2.74442c-1.46868,-13.92048 -14.33079,-23.60861 -24.92311,-23.60861s-23.45442,9.68813 -24.92311,23.60861c-0.13352,1.22342 0.93462,2.3807 2.53682,2.74442c1.55769,0.36372 3.29341,-0.16533 4.13902,-1.22342l4.22803,-5.6211c3.42693,-4.56301 8.54507,-7.1421 14.01925,-7.1421z',
btn: {left: 34, top: 20},
track: {track: '#47cffc', prog: '#fe64e7'},
img: {play: 'https://pic.imgdb.cn/item/65212a5ac458853aef566925.png', pause: 'https://pic.imgdb.cn/item/65212a6bc458853aef566b8e.png'}
});
});
loadJs(js2, () => {
H5lz({
papa: '#papa',
total: 5,
size: {width: 100, height: 100},
shape: {background: 'url("https://www.huachaowang.com/static/image/smiley/hcbiaoqing2/111.gif") no-repeat center/cover', borderRadius: '0'},
ani: 'toBottom',
maxTime: 25,
offset: {x: -100, y: 0},
});
});
})();
</script>
</td></tr></table> 醉美水芙蓉 发表于 2023-10-26 07:06
欣赏老师佳作!
问好水芙蓉!谢谢欣赏!{:4_187:} 好有趣,这个笑脸路径特别有趣,歌曲也特别滑稽。
粒子用论坛的表情,看着特别亲切{:4_173:} 这种带了内部线条的播放器路径唯一的麻烦是看不出进行到哪了,试着去点了一下,好像点外侧,从旁边进度时间才能知道进行到哪了,从路径上看不出{:4_173:} 蛋糕姐姐,亦是金老师选的歌曲演唱者都这么奇特{:4_173:} 再播放器路径方面,亦是金老师尝试了这么多的可能,很赞{:4_199:} 红影 发表于 2023-10-26 12:32
好有趣,这个笑脸路径特别有趣,歌曲也特别滑稽。
粒子用论坛的表情,看着特别亲切
问好红影!谢谢欣赏点评!{:4_187:} 红影 发表于 2023-10-26 12:34
这种带了内部线条的播放器路径唯一的麻烦是看不出进行到哪了,试着去点了一下,好像点外侧,从旁边进度时间 ...
{:4_189:} 红影 发表于 2023-10-26 12:35
蛋糕姐姐,亦是金老师选的歌曲演唱者都这么奇特
在抖音上听到这首歌,觉得有趣,就弄了一个玩玩!{:4_205:} 红影 发表于 2023-10-26 12:35
再播放器路径方面,亦是金老师尝试了这么多的可能,很赞
还准备再玩玩一些不同的路径呢!{:4_196:} 亦是金 发表于 2023-10-26 13:09
问好红影!谢谢欣赏点评!
其实上次的玫瑰花也是论坛表情吧,这个灵机一动特别好,这思路太灵活了{:4_199:} 亦是金 发表于 2023-10-26 13:10
还是只有外轮廓的或延伸线段的最好,看得更明确呢{:4_204:} 亦是金 发表于 2023-10-26 13:12
在抖音上听到这首歌,觉得有趣,就弄了一个玩玩!
这个歌手的发音不知是哪的,歌词内容也特别好玩{:4_189:} 亦是金 发表于 2023-10-26 13:15
还准备再玩玩一些不同的路径呢!
哦?还有哪里能找到这么方便的路径{:4_173:} 红影 发表于 2023-10-26 14:03
其实上次的玫瑰花也是论坛表情吧,这个灵机一动特别好,这思路太灵活了
是的!就地取材,简单方便!{:4_189:} 红影 发表于 2023-10-26 14:04
还是只有外轮廓的或延伸线段的最好,看得更明确呢
对!{:4_181:} 红影 发表于 2023-10-26 14:04
这个歌手的发音不知是哪的,歌词内容也特别好玩
{:4_189:} 红影 发表于 2023-10-26 14:05
哦?还有哪里能找到这么方便的路径
我还是在老地方找了一些,制作好了一大把路径,准备适时发布!{:4_189:} 前辈这个漂亮脸路径我不会做,就纯欣赏了
页:
[1]
2