当动态桌面遇上 HTML5

DreamScene2 + HTML5 = 无限可能。时隔一周,DreamScene2 动态桌面经过几个小版本的迭代,修复了一些问题并且功能也得到了增强。欢迎 Star 和 Fork https://github.com/he55/DreamScene2

萌萌的看板娘谁能拒绝

当动态桌面遇上 HTML5

喜欢可以看这里 https://github.com/he55/DreamScene2/releases/latest。资源是从 Live2D 官网提取下来的

使用方法

  • 先下载最新版本的 DreamScene2,然后下载 Hiyori.zip 文件
    当动态桌面遇上 HTML5

  • 解压后得到一个 html 文件
    当动态桌面遇上 HTML5

  • 安装 WebView2 运行时,如果已经安装过请跳过此步骤。先打开 DreamScene2,然后在任务栏托盘找到 DreamScene2 的图标,右键打开 DreamScene2 的设置界面,选择 打开 URL 然后点击 安装 WebView2...
    当动态桌面遇上 HTML5

  • 重要一步 由于 Hiyori.html 里面访问的资源我没有提取出来需要有网络才能加载,并且里面访问的 live2d model 是个跨域资源,需要设置允许跨域访问资源。具体操作:打开 DreamScene2 的设置界面,选择 打开 URL 然后勾选 禁用 Web 安全策略 (这只会禁用 DreamScene2 的 Web 安全策略)
    当动态桌面遇上 HTML5

  • 然后选择 打开文件...,在打开的选择文件窗口中设置 HTML Files (*.html),选择解压的 html 文件
    当动态桌面遇上 HTML5

  • 等待网络资源加载,最终效果如下
    当动态桌面遇上 HTML5

  • 如果看到的是下面这样,live2d model 一直显示不出来。先点击 关闭 按钮关闭动画,然后检查步骤四的 禁用 Web 安全策略 是否勾选
    当动态桌面遇上 HTML5

写在最后

下一步会增加与桌面的交互功能

上一篇:零基础必看的Html5+Css3+移动端前端视频教程(三)


下一篇:《网页设计与制作》学习进度