马黑黑 发表于 2022-2-2 21:25

加林森 发表于 2022-2-2 20:32
就是就是

{:4_190:}

加林森 发表于 2022-2-2 21:28

本帖最后由 加林森 于 2022-5-20 13:19 编辑 <br /><br />马黑黑 发表于 2022-2-2 21:25

{:4_191:}


<style>
.outerbox {
      position: relative;
      left: -242px;
      display: flex;
      justify-content: center;
      align-items: center;
      width: 1080px;
      height: 666px;
      background: #888 url('https://pic.imgdb.cn/item/6286f8d809475431290823e9.jpg') no-repeat center/cover;
      box-shadow: 2px 2px 8px rgba(0,0,0,.95);
      perspective: 3000px;
}
.innerbox {
      background: #666;
      box-shadow: 2px 2px 6px rgba(0,0,0,.85);
      transform-style: preserve-3d;
      animation: flyout 6s linear infinite alternate;
}
@keyframes flyout {
      0% { transform: rotate(0turn); width: 1px; height: 1px; }
      80%, 100% { transform: rotate(2turn); width: 600px; height: 600px; }
}
</style>

<div class="outerbox">
      <div class="innerbox"></div>
</div>

<script>

let picAr = [
      'https://pic.imgdb.cn/item/6286f9ce0947543129098349.jpg',
      'https://pic.imgdb.cn/item/6286fa9f09475431290ad48e.jpg',
      'https://pic.imgdb.cn/item/6286fb2809475431290b5d51.jpg',
      'https://pic.imgdb.cn/item/6286fbb809475431290bb0aa.jpg',
      'https://pic.imgdb.cn/item/6286fc9109475431290c3227.jpg'
];

let idx = 0;
let outer = document.querySelector('.outerbox');
let inner = document.querySelector('.innerbox');
let aud = document.createElement('iframe');
aud.src = 'https://music.163.com/outchain/player?type=2&id=1359398436&auto=1&height=66';
aud.style.display = 'none';
outer.appendChild(aud);

setBgImg();

setInterval(setBgImg, 12000);

function setBgImg(){
      inner.style = `background: url(${picAr}) no-repeat center/cover`;
      idx += 1;
      if(idx >= picAr.length) idx = 0;
}

</script>



加林森 发表于 2022-2-2 21:29

马黑黑 发表于 2022-2-2 21:25


Alma Attim精选维吾尔族歌曲 - 欢乐水吧 - 花潮论坛 - Powered by Discuz!
https://www.huachaowang.com/forum.php?mod=viewthread&tid=56664&extra=page%3D1

帮着我看看。
页: 1 [2]
查看完整版本: 思归 - 小新 (根据黑黑教程制作)TO:马黑黑