加林森 发表于 2022-3-18 23:16

默 -- 简弘亦 (移动图片)

本帖最后由 加林森 于 2022-3-19 12:45 编辑 <br /><br /><style>

#bgBox { position:relative; left: -15px; width: 790px; height: 430px; background-image: url('https://pic.imgdb.cn/item/6233f4f75baa1a80abd87a54.jpg'); background-size: 790px 430px; background-   ͼ

position: 790px 0; opacity: .96; animation: mv 28s linear infinite; }
#clkBtn { width: 100px; height: 100px; border-radius: 50%; background: rgba(0, 0, 0, .8); cursor: pointer;

position: relative; }
#clkBtn::before { content: ''; position: absolute; left: 5px; top: 5px; background: rgba(0, 0, 0, .2);

width: 88px; height: 88px; border: 1px solid #555; border-radius: 50%; }
#zhizhen { position: absolute; left: 50px; top: 50px; width: 2px; height: 44px; background: red;

transform-origin: 0 0; animation: go 3s linear infinite; }
@keyframes go { to { transform: rotate(360deg);} }
@keyframes mv { from { background-position: 790px 0; } to { background-position: 0 0; } }

</style>

<div id="bgBox">
<div style="position: absolute; left:90px; top: 10px; width:688px;text-align:center;">
      <img alt="" src=""/></div>
      <div id="clkBtn" style="left: 20px; top: calc(100% - 120px);">
                <div id="zhizhen"></div>
      </div>
      <audio id="music" autoplay="autoplay" loop="loop" src="http://www.kumeiwp.com/sub/filestores/2022/03/18/a8cd30d007cff874d38809d2c4c4a19d.mp3" ></audio></div>

<script language="javascript">
var aud = document.getElementById('music');
var btn = document.getElementById('clkBtn');
var zz = document.getElementById('zhizhen');
btn.onclick = function(){ aud.paused ? (aud.play(), zz.style.animationPlayState = "running") : (aud.pause

(), zz.style.animationPlayState = "paused"); }
aud.addEventListener("ended", function(){ zz.style.animationPlayState = "running"; });
</script>

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

本帖最后由 加林森 于 2022-3-18 23:40 编辑

@东篱闲人 @马黑黑 @红影

红影 发表于 2022-3-19 08:33

那只鹰哪去了?我是说有那只鹰的时候做动图漂亮,好像鹰在穿越山水{:4_173:}

马黑黑 发表于 2022-3-19 09:01

成功

东篱闲人 发表于 2022-3-19 10:06

加加,干的漂亮!{:5_116:}

东篱闲人 发表于 2022-3-19 10:07

图片可以简单处理一下,让两边对称,这样出来效果会浑然一体。。。{:4_190:}

加林森 发表于 2022-3-19 10:26

红影 发表于 2022-3-19 08:33
那只鹰哪去了?我是说有那只鹰的时候做动图漂亮,好像鹰在穿越山水

鹰太大了,放不进去。我看看能不能去找一个小鹰出来。

加林森 发表于 2022-3-19 10:26

马黑黑 发表于 2022-3-19 09:01
成功

谢谢老黑。{:4_190:}

加林森 发表于 2022-3-19 10:27

东篱闲人 发表于 2022-3-19 10:06
加加,干的漂亮!

谢谢老兄支持。{:4_190:}

加林森 发表于 2022-3-19 10:28

东篱闲人 发表于 2022-3-19 10:07
图片可以简单处理一下,让两边对称,这样出来效果会浑然一体。。。

我该怎么搞?我还准备放一只小鹰进去,不知道行不行呢。

红影 发表于 2022-3-19 11:07

加林森 发表于 2022-3-19 10:26
鹰太大了,放不进去。我看看能不能去找一个小鹰出来。

不大啊,那个鹰我也有收藏过的,看你前面一个帖子,那个鹰根本就不算大。

加林森 发表于 2022-3-19 11:08

红影 发表于 2022-3-19 11:07
不大啊,那个鹰我也有收藏过的,看你前面一个帖子,那个鹰根本就不算大。

我现在放不进去了

加林森 发表于 2022-3-19 11:09

红影 发表于 2022-3-19 11:07
不大啊,那个鹰我也有收藏过的,看你前面一个帖子,那个鹰根本就不算大。

是不是我的代码没有对呢?真奇怪。

马黑黑 发表于 2022-3-19 11:25

加林森 发表于 2022-3-19 10:26
谢谢老黑。

客气了

加林森 发表于 2022-3-19 11:29

马黑黑 发表于 2022-3-19 11:25
客气了

应该的

东篱闲人 发表于 2022-3-19 19:10

加林森 发表于 2022-3-19 10:28
我该怎么搞?我还准备放一只小鹰进去,不知道行不行呢。

图片做一下虚化处理。

加林森 发表于 2022-3-19 19:25

东篱闲人 发表于 2022-3-19 19:10
图片做一下虚化处理。

我不是PS,我用的是秀秀软件。

东篱闲人 发表于 2022-3-19 19:30

加林森 发表于 2022-3-19 19:25
我不是PS,我用的是秀秀软件。

嗯嗯嗯。。{:4_190:}

加林森 发表于 2022-3-19 19:34

东篱闲人 发表于 2022-3-19 19:30
嗯嗯嗯。。

快去看你师傅小辣椒发的帖吧。

红影 发表于 2022-3-19 19:54

加林森 发表于 2022-3-19 11:09
是不是我的代码没有对呢?真奇怪。

照你原来那个帖子里的位置放就可以了啊,是改底图成动的,又不需要改鹰{:4_173:}
页: [1] 2
查看完整版本: 默 -- 简弘亦 (移动图片)