美文网首页
亲测网页看板娘源码

亲测网页看板娘源码

作者: 10676 | 来源:发表于2022-07-22 15:42 被阅读0次

    直接上源码:

    <!DOCTYPE html>
    <html lang="zh">
     
    <head>
        <meta charset="UTF-8">
        <meta name="viewport" content="width=device-width, initial-scale=1.0">
        <title>看板娘</title>
    </head>
     
    <body>
        <!--
            可替换的模型名称
            2D模型全名称:
                live2d-widget-model-haruto      小娃娃(男)
                live2d-widget-model-koharu      小娃娃(女)
                live2d-widget-model-ni-j        小娃娃(不知道怎么描述,带这个耳机)
                live2d-widget-model-nico        小娃娃(狐狸??)
                live2d-widget-model-nipsilon    小娃娃(粉长头发小娃娃)
                live2d-widget-model-nito        小娃娃(粉短头发小娃娃)
                live2d-widget-model-unitychan   小娃娃(黄色长头发小娃娃)
                live2d-widget-model-chitose     一个帅哥
                live2d-widget-model-shizuku     坐在课桌上的小美女
                live2d-widget-model-hibiki      一个小妹妹
                live2d-widget-model-izumi       一个妹子
                live2d-widget-model-tsumiki     绿萝????
                live2d-widget-model-miku        初音
                live2d-widget-model-z16         这个妹子好看
                live2d-widget-model-hijiki      黑猫
                live2d-widget-model-tororo      白猫
                live2d-widget-model-wanko       趴在碗里的狗
        -->
        <div id="live2d-widget">
            <canvas id="live2dcanvas">
        </div>
    </body>
    <script src="https://cdn.bootcdn.net/ajax/libs/jquery/1.12.4/jquery.min.js"></script>
    <script src="https://eqcn.ajz.miesnfu.com/wp-content/plugins/wp-3d-pony/live2dw/lib/L2Dwidget.min.js"></script>
    <script>
        L2Dwidget.init({
            "model": {
                jsonPath: "https://unpkg.com/live2d-widget-model-shizuku/assets/shizuku.model.json",//这里改模型,前面后面都要改
                "scale": 1
            },
            "display": {
                "position": "left",//设置看板娘的上下左右位置
                "width": 200,
                "height": 200,
                "hOffset": 70,
                "vOffset": 0
            },
            "mobile": {
                "show": true,
                "scale": 0.5
            },
            "react": {
                "opacityDefault": 0.7,//设置透明度
                "opacityOnHover": 0.2
            }
        });
        window.onload = function () {
            $("#live2dcanvas").attr("style", "position: fixed; opacity: 0.7; left: 170px; bottom: 0px; z-index: 1; pointer-events: none;")
        }
    </script>
     
    </html>
    
    

    ————————————————
    版权声明:本文为CSDN博主「weixin_42502300」的原创文章,遵循CC 4.0 BY-SA版权协议,转载请附>上原文出处链接及本声明。
    原文链接:https://blog.csdn.net/weixin_42502300/article/details/120352459

    相关文章

      网友评论

          本文标题:亲测网页看板娘源码

          本文链接:https://www.haomeiwen.com/subject/klwmirtx.html