html页面美化萌娘，磁流式

1.鼠标拖动磁流式

今天写项目时候，出现bug去网上查，看到别人写的以页面有2d萌娘，以及鼠标移动时会有磁流式移动效果，很有意思，了解后发现很简单

只需要在页面里加入这行代码，就会出现磁流式拖动效果

<script type="text/javascript" color="0,0,255" opacity='0.7' zIndex="-2" count="99"
        src="//cdn.bootcss.com/canvas-nest.js/1.0.1/canvas-nest.min.js"></script>
        

当然参数可以自己设置

2.桌面小萌娘

话不多上，上代码自行体现

<script src="https://eqcn.ajz.miesnfu.com/wp-content/plugins/wp-3d-pony/live2dw/lib/L2Dwidget.min.js"></script>
<!--小帅哥： https://unpkg.com/live2d-widget-model-chitose@1.0.5/assets/chitose.model.json-->
<!--萌娘：https://unpkg.com/live2d-widget-model-shizuku@1.0.5/assets/shizuku.model.json-->
<!--小可爱（女）：https://unpkg.com/live2d-widget-model-koharu@1.0.5/assets/koharu.model.json-->
<!--小可爱（男）：https://unpkg.com/live2d-widget-model-haruto@1.0.5/assets/haruto.model.json-->
<!--初音：https://unpkg.com/live2d-widget-model-miku@1.0.5/assets/miku.model.json-->
<!-- 上边的不同链接显示的是不同的小人，这个可以根据需要来选择 下边的初始化部分，可以修改宽高来修改小人的大小，或者是鼠标移动到小人上的透明度，也可以修改小人在页面出现的位置。 -->
<script> L2Dwidget.init({
    "model": {
        jsonPath: "https://unpkg.com/live2d-widget-model-shizuku@1.0.5/assets/shizuku.model.json",
        <%--jsonPath:"<c:url value='json/1.json'/>",--%>
        "scale": 1
    },
    "display": {"position": "right", "width": 250, "height": 400, "hOffset": 0, "vOffset": -20},
    "mobile": {"show": true, "scale": 0.5},

    "react": {"opacityDefault": 0.8, "opacityOnHover": 0.1}
}); </script>

里面不同链接可以选择不同样式，都是官网啥的给出来的，只要不撤销可以一直用，就不一一展示了，如果会制作2d效果图的朋友们也可以自己制作

最后，说实话挺好看的，继续努力