青 花(马黑黑原创)TO:亦是金
本帖最后由 朵拉 于 2023-11-17 21:15 编辑 <br /><br /><style>#papa { margin: 0 0 0 calc(50% - 593px); width: 1024px; height: 640px; background: url('https://pic.imgdb.cn/item/6557616bc458853aefb06e43.jpg') no-repeat center/cover; box-shadow: 3px 3px 20px #000; overflow: hidden; z-index: 1; position: relative; display: grid; place-items: center; }
#papa::before { position: absolute; content: ''; width: 200px; height: 200px; right: 100px; bottom: 40px; background: url('data:image/svg+xml;charset=utf-8,<svg width="200" height="200" xmlns="http://www.w3.org/2000/svg"><path d="M110.00 100.00 147.50 182.27 95.00 108.66 5.00 100.00 95.00 91.34 147.50 17.73z" fill="red" /></svg>'); animation: rot 8s infinite linear var(--state); }
@keyframes rot { to { transform: rotate(1turn); } }
</style>
<div id="papa"></div>
<audio id="aud" src="https://music.163.com/song/media/outer/url?id=189602" autoplay loop></audio>
<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 playerJs = 'https://638183.freep.cn/638183/web/api/svg_path_lrc.js';
let lrcAr = [,
,
,
,
,
,
,
,
,
,
,
,
,
,
,
,
,
,
,
,
,
,
,
,
,
,
,
,
,
,
,
,
];
loadJs(playerJs, () => {
HCPlayer({
papa: '#papa',
lrcAr: lrcAr,
lrc_css: 'top: 20px;',
fs_css: 'top: -1000px; background: transparent;',
player_css: `
width: 200px;
height: 200px;
right: 100px;
bottom: 40px;
`,
path: 'M170.00 100.00 189.27 132.49 153.62 145.00 147.50 182.27 112.16 168.94 83.50 193.56 65.00 160.62 27.23 161.06 34.22 123.94 5.00 100.00 34.22 76.06 27.23 38.94 65.00 39.38 83.50 6.44 112.16 31.06 147.50 17.73 153.62 55.00 189.27 67.51z',
btn: {left: 34, top: 80},
track: {track: 'silver', prog: 'snow'},
img: {play: '', pause: ''}
});
});
})();
</script> @马黑黑
马师 晚上好,学生交作业,请指正哈{:4_190:} @亦是金
感谢亦是金老师的重新编辑,很漂亮哈{:4_190:} 欣赏朵拉的马老师的双路径制作,冬天还没有做过的
你是直接套用代码,效果没有修改过的? 歌曲好听的{:4_208:} 冬天的雨 发表于 2023-11-17 21:23
欣赏朵拉的马老师的双路径制作,冬天还没有做过的
你是直接套用代码,效果没有修改过的?
学生手机编辑不方便,目前直接用代码{:5_111:}{:5_111:} 朵拉 发表于 2023-11-17 21:02
@马黑黑
马师 晚上好,学生交作业,请指正哈
漂亮 朵拉 发表于 2023-11-17 21:28
学生手机编辑不方便,目前直接用代码
朵拉很棒,手机编辑,特别歌词同步也是编辑了,佩服的{:4_199:} 好听的歌儿,漂亮的制作。欣赏朵宝好帖{:4_204:} 朵拉 发表于 2023-11-17 21:17
@亦是金
感谢亦是金老师的重新编辑,很漂亮哈
问好朵拉!帖子制作漂亮,欣赏学习了!{:4_187:}
页:
[1]