是的,这次制作了,再多巩固几次应该记住了。
熟能生巧 本帖最后由 加林森 于 2022-5-17 18:16 编辑 <br /><br />马黑黑 发表于 2022-1-3 11:43
熟能生巧
是的是的
<style>
.bgBox { left: -242px; width: 1024px; height: 576px; background: rgba(0,0,0,.15) url('https://pic.imgdb.cn/item/62836a800947543129e5e763.jpg') no-repeat center/cover; overflow: hidden; position: relative; }
.b-img { position: absolute; width: 350px; bottom: 0; mix-blend-mode: multiply; }
.s-img { position: absolute; width: 200px; left: calc(100% - 210px); top:5px; border-radius: 50%; opacity: .4; }
.s-bg { position: absolute; width: 80px; height: 80px; border-radius: 50%; left: 10px; top: calc(100% - 90px); filter: drop-shadow(0 0 50px rgba(0,0,0,.9)); cursor: pointer; animation: rot 4s linear infinite; }
@keyframes rot { to { transform: rotate(1turn); } }
</style>
<div class="bgBox">
<img class="b-img" src="https://pic.imgdb.cn/item/62836e760947543129f17972.jpg" alt="" />
<img class="s-img" src="https://pic.imgdb.cn/item/62836e760947543129f17972.jpg" alt="" />
<div class="bgBox s-bg"></div>
</div>
<script>
let flag = true;
let sbg = document.querySelector('.s-bg');
let au = document.createElement('audio');
//Venice Beach
au.autoplay = flag;
au.loop = true;
au.style.display = 'none';
sbg.appendChild(au);
if(!flag) sbg.style.animationPlayState = 'paused';
sbg.onclick = function(){
flag ? (au.pause(),this.style.animationPlayState='paused',flag=false) : (au.play(),this.style.animationPlayState='running',flag=true);
}
</script>
<iframe frameborder="no" border="0" marginwidth="0" marginheight="0" width=330 height=450 src="//music.163.com/outchain/player?type=0&id=64549075&auto=1&height=430"></iframe> 马黑黑 发表于 2022-1-3 11:43
谢茶 加林森 发表于 2022-1-3 11:53
谢茶
队长客气了 马黑黑 发表于 2022-1-3 12:38
队长客气了
应该的嘛 加林森 发表于 2022-1-3 12:53
应该的嘛
嗯嗯,那好 马黑黑 发表于 2022-1-3 12:59
嗯嗯,那好
喝酒没有? 加林森 发表于 2022-1-3 13:00
喝酒没有?
喝了喝了喝多了去休息下 马黑黑 发表于 2022-1-3 13:01
喝了喝了喝多了去休息下
好的好的,去休息吧! 加林森 发表于 2022-1-3 13:03
好的好的,去休息吧!
队长下午好 马黑黑 发表于 2022-1-3 15:29
队长下午好
老黑下午好。休息好了吗? 加林森 发表于 2022-1-3 16:22
老黑下午好。休息好了吗?
早休息好了 马黑黑 发表于 2022-1-3 17:15
早休息好了
我也回家了。
页:
1
[2]