大猫咪 发表于 2021-12-11 20:58
队长辛苦,猫最理解
嗯嗯,真是乖猫!{:4_179:}
加林森 发表于 2021-12-11 21:00
嗯嗯,真是乖猫!
{:4_179:}温暖
本帖最后由 加林森 于 2022-4-30 00:04 编辑 <br /><br />大猫咪 发表于 2021-12-11 21:02
温暖
好的好的,我已经制作好了另外一首歌,就是图片没有对还没有发出来。
<style>
.outer { text-align: center; }
.mama { margin: auto; display: inline-block; padding: 20px; vertical-align: middle; position: relative; }
.sPic { outline: none; }
.picTip { position: absolute; top: 30px; left: 30px; color: white; font: normal 1.5em / 2em sans-serif; text-shadow: 1px 1px 2px gray; mix-blend-mode: difference; }
</style>
<div class="outer">
<div class="mama">
<img class="sPic" src="https://pic.imgdb.cn/item/626be659239250f7c568cc47.jpg" alt="" />
<div class="picTip">第一张</div>
</div>
</div>
<script>
let mama = document.querySelector(".mama");
let sPic = document.querySelector(".sPic");
let picTip = document.querySelector(".picTip");
let isGo = true;
let cuImg = 0;
let picAr = [
["https://pic.imgdb.cn/item/626be7ba239250f7c56c58fc.jpg","第一张"],
["https://pic.imgdb.cn/item/626be7ba239250f7c56c58fc.jpg","第二张"],
["https://pic.imgdb.cn/item/626be98a239250f7c57113dd.jpg","第三张"],
["https://pic.imgdb.cn/item/626beb69239250f7c575e9ab.jpg","第四张"]
];
mama.onmousemove = function(e) {
e = e || event;
let x = e.clientX - this.offsetLeft;
let y = this.clientWidth;
this.style.cursor =`url('https://638183.freep.cn/638183/qd/${x > y/2 ? "next.cur" : "pre.cur"}'), auto`;
isGo = x > y/2? true : false;
}
mama.onclick = function(){
cuImg += isGo ? 1 : -1;
if (cuImg >= picAr.length) cuImg = 0;
if (cuImg < 0) cuImg = picAr.length - 1;
sPic.src = picAr;
picTip.innerHTML = picAr;
}
</script>
<iframe frameborder="no" border="0" marginwidth="0" marginheight="0" width=1 height=1 src="//music.163.com/outchain/player?type=2&id=1940943649&auto=1&height=66"></iframe>
加林森 发表于 2021-12-11 21:12
好的好的,我已经制作好了另外一首歌,就是图片没有对还没有发出来。
不急不急队长,慢慢做,猫等着欣赏 {:4_180:}
大猫咪 发表于 2021-12-11 21:17
不急不急队长,慢慢做,猫等着欣赏
好的好的{:4_179:}