<style>
#outblk { width: 1024px; height: 640px; background: url('https://s1.ax1x.com/2022/10/23/x2SpGD.jpg') no-repeat center/cover; box-shadow: 3px 3px 20px #000; position: relative; margin:100px 16px 32px -200px}
.fish {offset-distance: 100%; animation: swim 45s infinite; }
.fish:nth-child(1){offset-path: path('M110 495 a 93.5 62 0 1 0 187 0 a 93.5 62 0 1 0 -187 0z');}
.fish:nth-child(2){offset-path: path('M700 505 a 93.5 62 0 1 0 187 0 a 93.5 62 0 1 0 -187 0z'); animation-delay: 30s;}
.fish:nth-child(3){offset-path: path('M330 500 a 93.5 62 0 1 0 187 0 a 93.5 62 0 1 0 -187 0z'); animation-delay: 15s;}
@keyframes swim { to { offset-distance: 0%; } }
</style>
<div id="outblk">
<img class="fish" src="https://wj1.zp68.com:812/lxx/yunhua/2022/10/02/gnyu.jpg" alt="" />
<img class="fish" src="https://wj1.zp68.com:812/lxx/yunhua/2022/10/02/gnyu.jpg" alt="" />
<img class="fish" src="https://wj1.zp68.com:812/lxx/yunhua/2022/10/02/gnyu.jpg" alt="" />
</div>
<svg width="100%" height="100%" viewBox="0 0 1000 600"
xmlns="http://www.w3.org/2000/svg"
xmlns:xlink="http://www.w3.org/1999/xlink">
<defs>
<path id="MyPath"
d="
M 200 200
m -100, 150
a 300,200 0 1,0 600,0
a 300,200 0 1,0 -600,0
"/>
</defs>
<use xlink:href="#MyPath" fill="none" stroke="transparent"/>
<text font-family="Verdana" font-size="50" stroke="red" fill="yellow">
<textPath xlink:href="#MyPath">
欣赏、点赞！
<animate attributeName="startOffset" from="0" to ="1656" begin="0s" dur="10s" repeatCount="indefinite" />
</textPath>
</text>
</svg> 精彩的画面，动人的歌声！{:4_199:} 今天的小鱼儿统统不见了{:4_189:} 欣赏水芙蓉的精彩制作 小辣椒 发表于 2022-10-23 21:30
今天的小鱼儿统统不见了
现在出来了 做的精美。棒棒哒 醉美水芙蓉 发表于 2022-10-23 21:52
有点云里雾里的，对这个播放器还是有点懵！好多地方不会修改！
你用的是svg播放器。
进度条：id="track" 是底轨，id="prog" 是进度，颜色方面，fill 是填充色，stroke是描边色，我用了 hsla 颜色体系，表示为 hlsa(...)，你可以删掉，换上 #ffcc00 或者 black 之类的。
文本按钮，text 标签，id="btnplay"就是，也是改 fill="颜色" 这个地方。 水芙蓉的同步做得漂亮，背景也选的好{:4_187:} 好听 好看，欣赏{:4_204:} 这图漂亮我也存有，还没想到音乐来做 很漂亮。欣赏水芙蓉美女精彩制作{:4_187:}
页:
[1]
2