绿叶清舟 发表于 2024-3-14 13:39

Can’t Catch Me Now

本帖最后由 绿叶清舟 于 2024-3-14 20:16 编辑 <br /><br /><style>
#mama1 { position: relative; left: -252px; width: 1100px; height: 700px; background: #ccc url('https://pic.imgdb.cn/item/65f27a509f345e8d031bc0ff.jpg') no-repeat; box-shadow: 2px 2px 2px #444; overflow: hidden; }
#vid { position: absolute; width: 1300px; height: 700px; object-fit: cover; opacity: 1; clip-path: circle(100% at bottom) ;mix-blend-mode: screen;}
#btnplay { position: absolute; width: 1300px; height: 700px; left: 0; top: 10px; opacity: .7; transition: 6s; cursor: pointer; animation: rot 8s linear infinite var(--state); }
</style>

<div id="mama1">
       <div id="vid">
<videoid="btnplay" src="https://img.tukuppt.com/video_show/2432605/00/01/90/5b4cd0d177954.mp4" autoplay="autoplay" loop="loop" muted="muted"></video></div>
      
<audio id="aud" src="https://music.163.com/song/media/outer/url?id=2096382724.mp3" autoplay loop></audio>
</div>

<script>
(function() {
    let sF = document.createElement('script');
    sF.src = 'https://638183.freep.cn/638183/web/api/fullscreen.js';
    sF.charset = 'utf-8';
    document.querySelector('body').appendChild(sF);
    sF.onload = () => FS({papa: '#papa', css: '--bg: transparent; --color: #eee; bottom: 10px; left: 48%;'});
    let mState = () => aud.paused ? (papa.style.setProperty('--state','paused'),btnplay.title = '点击播放',vid.pause()) : (papa.style.setProperty('--state','running'),btnplay.title = '点击暂停',vid.play());
    let getOffsetPos = (ele) => { let x = ele.offsetLeft, y = ele.offsetTop, pa = ele.offsetParent; while(pa != null) { x += pa.offsetLeft; y += pa.offsetTop; pa = pa.offsetParent; } return {x, y}; };
    aud.onplaying = aud.onpause = () => mState();
    btnplay.onclick = () => aud.paused ? aud.play() : aud.pause();
    let movTimer = null, paWidth = papa.clientWidth, sonSize = btnplay.clientWidth, bodyWidth = document.body.clientWidth, paOffset = getOffsetPos(papa).x;
    document.onmousemove = function(e) {
    clearTimeout(movTimer);
    movTimer = setTimeout(function() { if (e.target.id === "btnplay") return; if (document.fullscreenElement === null) { let x = e.pageX; if (x < paOffset) x = paOffset; x = x - paOffset; if (x + sonSize >= paWidth) x = paWidth - sonSize; btnplay.style.cssText += `left: ${x}px;`; vid.style.cssText += `left: ${x - 150}px;`; } else { let xx = e.offsetX || e.layerX; if (xx + sonSize > bodyWidth) xx -= sonSize; btnplay.style.cssText += `left: ${xx}px;`; vid.style.cssText += `left: ${xx - 150}px;`; } }, 400);
};
})();
</script>

马黑黑 发表于 2024-3-14 13:42

猪比特之箭也抓不到吗{:4_170:}

红影 发表于 2024-3-14 14:11

很震撼的画面，清舟的这个帖子很霸气呢{:4_173:}{:4_199:}

小辣椒 发表于 2024-3-14 16:07

清舟，我是手机，画面很炫酷，播放器按钮找不到，我画面点来点去，没有听到音乐{:4_198:}

安宁 发表于 2024-3-14 18:00

薛仁贵三箭定天山   清舟一箭定江山   ……绝杀{:5_104:}

樵歌 发表于 2024-3-14 18:56

清舟想射谁哇{:4_193:}

绿叶清舟 发表于 2024-3-14 20:49

马黑黑 发表于 2024-3-14 13:42
猪比特之箭也抓不到吗

没有马的快{:4_189:}

绿叶清舟 发表于 2024-3-14 20:50

红影 发表于 2024-3-14 14:11
很震撼的画面，清舟的这个帖子很霸气呢

有火啊

绿叶清舟 发表于 2024-3-14 20:51

小辣椒 发表于 2024-3-14 16:07
清舟，我是手机，画面很炫酷，播放器按钮找不到，我画面点来点去，没有听到音乐

下午隐藏的播放器，是不是手机不能自动播放啊，按钮加上去了

绿叶清舟 发表于 2024-3-14 20:52

安宁 发表于 2024-3-14 18:00
薛仁贵三箭定天山   清舟一箭定江山   ……绝杀

安宁好啊，好久不见了，俺有这么厉害吗{:4_173:}

绿叶清舟 发表于 2024-3-14 20:52

樵歌 发表于 2024-3-14 18:56
清舟想射谁哇

别跑啊，来谈谈{:4_189:}

红影 发表于 2024-3-14 22:16

绿叶清舟 发表于 2024-3-14 20:50
有火啊

是的，烧很旺盛{:4_173:}

樵歌 发表于 2024-3-15 11:12

绿叶清舟 发表于 2024-3-14 20:52
别跑啊，来谈谈

让箭再飞一会吧{:4_189:}

马黑黑 发表于 2024-3-15 11:54

绿叶清舟 发表于 2024-3-14 20:49
没有马的快

慢动作呀

绿叶清舟 发表于 2024-3-16 20:01

樵歌 发表于 2024-3-15 11:12
让箭再飞一会吧

已经飞得很远了{:4_189:}

绿叶清舟 发表于 2024-3-16 20:01

马黑黑 发表于 2024-3-15 11:54
慢动作呀

再快也没马快啊

樵歌 发表于 2024-3-16 21:25

绿叶清舟 发表于 2024-3-16 20:01
已经飞得很远了

谁中了{:4_189:}

马黑黑 发表于 2024-3-16 21:40

绿叶清舟 发表于 2024-3-16 20:01
再快也没马快啊

马地上跑的快不了多少

大猫咪 发表于 2024-3-17 20:52

引人入胜的歌。 构图真棒    现在听舒服！   一听就进去了。。。

{:4_187:}{:4_178:}{:4_199:}

绿叶清舟 发表于 2024-3-18 21:00

樵歌 发表于 2024-3-16 21:25
谁中了

不知道啊{:4_189:}
页: [1] 2 3 4
查看完整版本: Can’t Catch Me Now