一片伟大的净土

灵魂的归处,肉体的坟墓。

20241120博客更新记录

2024/11/20 杂谈

这live2d小人是不是傻逼? 左下角也会挡住,右下角也会挡住,此处留档。
你只需要在类似layout的地方,head中添加下列代码第一个script,body中添加第二个scrpit即可

        <script>
            const live2d_path = "https://fastly.jsdelivr.net/gh/stevenjoezhang/live2d-widget@latest/";

            function loadExternalResource(url, type) {
                return new Promise((resolve, reject) => {
                    let tag;

                    if (type === "css") {
                        tag = document.createElement("link");
                        tag.rel = "stylesheet";
                        tag.href = url;
                    } else if (type === "js") {
                        tag = document.createElement("script");
                        tag.src = url;
                    }
                    if (tag) {
                        tag.onload = () => resolve(url);
                        tag.onerror = () => reject(url);
                        document.head.appendChild(tag);
                    }
                });
            }

            if (screen.width >= 768) {
                Promise.all([
                    loadExternalResource(live2d_path + "waifu.css", "css"),
                    loadExternalResource(live2d_path + "live2d.min.js", "js"),
                    loadExternalResource(live2d_path + "waifu-tips.js", "js"),
                ]).then(() => {
                    initWidget({
                        waifuPath: live2d_path + "waifu-tips.json",
                        cdnPath: "https://fastly.jsdelivr.net/gh/fghrsh/live2d_api/",
                        tools: ["hitokoto", "asteroids", "switch-model", "switch-texture", "photo", "info", "quit"],
                    });
                });
            }
        </script>
        <script>
            window.addEventListener('load', () => {
                // Ensure the Live2D widget is initialized before applying style changes
                const waifuElement = document.getElementById('waifu');
                if (waifuElement) {
                    waifuElement.style.left = 'unset'; // Remove left positioning
                    waifuElement.style.right = '0';    // Set right positioning to 0
                    waifuElement.style.bottom = '0';   // Set bottom positioning to 0
                }
            });
        </script>