这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>