《琵琶行》- 奇然 / 沈谧仁
本帖最后由 加林森 于 2022-8-23 12:13 编辑 <br /><br /><style>#papa { left: -214px; width: 1024px; height: 640px; box-shadow: 3px 3px 20px #000; position: relative; }
#disc { position: absolute; width: 40px; height: 40px; left: 10px; top: 10px; background: conic-gradient(red,orange,yellow,green,teal,blue,purple); mask: radial-gradient(transparent 4px,red 0); -webkit-mask: radial-gradient(transparent 4px,red 0); border-radius: 50%; cursor: pointer; animation: rot 2s linear infinite; }
#lrcbox { position: absolute; left: 80px; top: 10px;font: bold 22px / 40px sans-serif; color: lightblue; text-shadow: 2px 2px 4px #222; }
@keyframes rot { to { transform: rotate(360deg); } }
</style>
<div id="papa">
<div style="width:1024px;left:-0px;position:relative;overflow:hidden;margin:0px 0 32px -0px;transform:scale(1.3);">
<video src="http://kvideo01.youju.sohu.com/ce99c50d-db63-4ceb-b841-cc379ee7268f2_0_0.mp4" loop autoplay controls width='100%' ></video>
<span id="disc"></span>
<span id="lrcbox">琵琶行</span>
</div>
<script>
let aud = new Audio();
aud.src = 'https://music.163.com/song/media/outer/url?id=476513774.mp3 '
aud.autoplay = true;
disc.style.animationPlayState = aud.paused ? 'paused' : 'running';
disc.onclick = () => aud.paused ? aud.play() : aud.pause();
aud.addEventListener('playing',()=> disc.style.animationPlayState = 'running');
aud.addEventListener('pause',()=> disc.style.animationPlayState = 'paused');
</script>
@马黑黑 我不知道是否成功了？请你看看。 我是根据你的《中间挖空的光盘播放器》制作的。结果这个有点大呢？ 我只看到了视频，可能又是单位网的问题，要等回去再欣赏了{:4_187:} 红影 发表于 2022-8-23 12:16
我只看到了视频，可能又是单位网的问题，要等回去再欣赏了
可以的可以的。 @东篱闲人帮着看看，是不是哪里有问题？ 加林森 发表于 2022-8-23 12:53
@东篱闲人帮着看看，是不是哪里有问题？
是一个视频。后台俺看不了，没权限。。。{:5_103:} 很古典，很漂亮！{:5_116:} 东篱闲人 发表于 2022-8-23 12:54
是一个视频。后台俺看不了，没权限。。。
我把代码发给你看看。 本帖最后由 加林森 于 2022-8-23 13:02 编辑
东篱闲人 发表于 2022-8-23 12:55
很古典，很漂亮！
东篱闲人 发表于 2022-8-23 12:55
很古典，很漂亮！
现在我发给你了，你看看。 加林森 发表于 2022-8-23 12:56
#papa { left: -214px; width: 1024px; height: 640px; box-shadow: 3px 3px 20px #000; position: rel ...
这个代码只有视频，没有图片。 东篱闲人 发表于 2022-8-23 12:58
这个代码只有视频，没有图片。
是的。 风云变幻，令人目不暇接。队长好制作。赞！ 马黑黑 发表于 2022-8-23 13:02
风云变幻，令人目不暇接。队长好制作。赞！
合格不？ 加林森 发表于 2022-8-23 13:03
合格不？
何止合格，这是优秀作品。建议加为精华。 马黑黑 发表于 2022-8-23 13:05
何止合格，这是优秀作品。建议加为精华。
谢谢老黑！我终于成功了。{:4_191:} 加林森 发表于 2022-8-23 13:09
谢谢老黑！我终于成功了。
有自己创意的就会令人耳目一新 马黑黑 发表于 2022-8-23 17:32
有自己创意的就会令人耳目一新
是的。还真不容易啊。
页:
[1]
2