加林森 发表于 2022-8-3 11:01

《壮志在我胸 》- 成龙

本帖最后由 加林森 于 2022-8-3 17:51 编辑 <br /><br /><style>
#papa { left: -302px; width: 1200px; height: 739px; display: flex; justify-content: center; background: #000 url('https://s1.ax1x.com/2022/08/03/vV260I.jpg') no-repeat center/cover; perspective: 2000px; box-shadow: 4px 4px 24px #000; font-size: 18px; position: relative; }
#papa h2 { position: absolute; margin-top: 20px; font: bold 30px / 30px sans-serif; color: #222; text-shadow: 1px 2px 3px #aaa; }
#wrapper { position: absolute; left: 40%;top: 220px; width: 300px; height: 300px; transform-style: preserve-3d; transform: rotateX(-15deg) rotateY(-20deg); animation: rot1 4s linear forwards; }
#ball { position: absolute; left: -560px; top: 100px; width: 301px; height: 221px; border-radius: 50%; transform: translateZ(20px);}
#btnPlay { position: absolute; left: 40px; bottom: 40px; outline: none; cursor: pointer; }
#yyMsg { position: absolute; left: 110px; bottom: 40px; color:Black; }
#btnBegin { position: absolute; bottom: 40px; outline: none; cursor: pointer; }
#mkMsg { position: absolute; left: 300px; bottom: 40px; }
</style>

<div id="papa">
      <h2></h2>
      <div id="wrapper"><img id="ball" src="https://pic.imgdb.cn/item/6247e3c027f86abb2a56f17a.gif" alt="" /></div>
      <input id="btnPlay" type="button" value="音乐停" />
      <span id="yyMsg">背景音乐 -壮志在我胸</span>
      <span id="mkMsg"></span>
</div>

<script>
let aud = new Audio();
aud.src = 'https://music.163.com/song/media/outer/url?id=4878590.mp3';
aud.loop = true;
aud.autoplay = true;

btnPlay.onclick = () => aud.paused ? aud.play() : aud.pause();

aud.addEventListener('playing', () => btnPlay.value = '音乐停');
aud.addEventListener('pause', () => btnPlay.value = '音乐放');

</script>

加林森 发表于 2022-8-3 11:01

@马黑黑

红影 发表于 2022-8-3 11:55

这种也很简洁，欣赏队长好帖。

马黑黑 发表于 2022-8-3 12:09

队长玩鹰高手

加林森 发表于 2022-8-3 12:19

红影 发表于 2022-8-3 11:55
这种也很简洁，欣赏队长好帖。

谢谢红影。

加林森 发表于 2022-8-3 12:19

马黑黑 发表于 2022-8-3 12:09
队长玩鹰高手

放鹰出来玩一下。{:4_189:}

小辣椒 发表于 2022-8-3 17:26

队长学习也是快的，但套用也是要会看代码，这个老鹰的尺寸大小你要自己修改一下的

加林森 发表于 2022-8-3 17:33

小辣椒 发表于 2022-8-3 17:26
队长学习也是快的，但套用也是要会看代码，这个老鹰的尺寸大小你要自己修改一下的

是的，我知道这个代码在哪里修改的。把鹰改小了没有气势。我是这样认为的。不知道对不对？

小辣椒 发表于 2022-8-3 17:40

加林森 发表于 2022-8-3 17:33
是的，我知道这个代码在哪里修改的。把鹰改小了没有气势。我是这样认为的。不知道对不对？

黑黑，这个代码带了四周的圆角，你如果想老鹰大一点的效果就要等比例缩放

加林森 发表于 2022-8-3 17:50

小辣椒 发表于 2022-8-3 17:40
黑黑，这个代码带了四周的圆角，你如果想老鹰大一点的效果就要等比例缩放

好的。我现在把鹰缩小点。

加林森 发表于 2022-8-3 17:53

小辣椒 发表于 2022-8-3 17:40
黑黑，这个代码带了四周的圆角，你如果想老鹰大一点的效果就要等比例缩放

现在修改了，你再看看。

小辣椒 发表于 2022-8-3 17:57

加林森 发表于 2022-8-3 17:53
现在修改了，你再看看。

好的，我准备下了，吃饭去了。晚上见

马黑黑 发表于 2022-8-3 18:11

加林森 发表于 2022-8-3 12:19
放鹰出来玩一下。

放风的说

加林森 发表于 2022-8-3 18:21

小辣椒 发表于 2022-8-3 17:57
好的，我准备下了，吃饭去了。晚上见

好的。晚上见！

加林森 发表于 2022-8-3 18:22

马黑黑 发表于 2022-8-3 18:11
放风的说

就是。放出来释放心情。

上海朝阳 发表于 2022-8-3 19:14

这只鹰没朝前俯冲，因为前面没有飞鸟

马黑黑 发表于 2022-8-3 19:56

加林森 发表于 2022-8-3 18:22
就是。放出来释放心情。

挺好的

加林森 发表于 2022-8-3 20:11

上海朝阳 发表于 2022-8-3 19:14
这只鹰没朝前俯冲，因为前面没有飞鸟

对头。

加林森 发表于 2022-8-3 20:11

马黑黑 发表于 2022-8-3 19:56
挺好的

是的。
页: [1]
查看完整版本: 《壮志在我胸 》- 成龙