跳至主要内容

给你的网页添加一个“躲猫猫”

无意中在某大佬的网站发现的,就捉了回来
如果你喜欢,也可以抓回去。
#CSS代码

#maomao {
            position: fixed;
            bottom: 40px;
            right: -5px;
            width: 57px;
            height: 70px;
            background-image: url(https://cdn.jsdelivr.net/gh/muzihuaner/huancdn/img/20210808215127.svg);
            background-position: center;
            background-size: cover;
            background-repeat: no-repeat;
            transition: background .3s;
        }

        #maomao:hover {
            background-position: 60px 50%;
        }
#JS代码
var randomNum = function(minNum, maxNum) {
            switch(arguments.length){
                case 1:
                    return parseInt(Math.random() * minNum + 1, 10);
                    break;
                case 2:
                    return parseInt(Math.random() * (maxNum - minNum + 1) + minNum, 10);
                    break;
                default:
                    return 0;
                    break;
            }
        }
        var duoMaomao = function () {
            var maomao = $('#maomao');
            maomao.css('bottom', randomNum(5, 80) + 'vh');
        }
#HTML代码
《div id="maomao" onmouseout="duoMaomao()"》《/div》
“《》”自行替换

The End

博客:奕奕Blog

网址: eebk.com

版权: 欢迎分享