不错的二次元个人导航页源码

标签：heheda 导航页 二次元 源码 new workbox event css

这里写目录标题

• 前言
• 效果图
• 使用说明
• • 背景图
  • 如果您想提升加载效率,您可以考虑进行以下操作
  • 背景音乐
  • 图标
  • 温馨提示
  • 常见问题
• 部分源码
• 领取源码
• 下期更新

前言

没事逛逛源码仓库发现有款好看的二次元个人页导航源码不错就转发了一下，这是开源项目有需要的自行下载体验，作者还会不定时的更新的。

这是一个漂亮的二次元个人主页，希望大家提出意见或指出错误。同时，也欢迎大佬参与开发。

效果图

使用说明

背景图

背景图标调用的是本人自建的动漫API接口：https://cartoon.heheda.top/url.php，调用的人很多，所以不是很稳定，嫌弃的话可以自行更换。

若背景图片无法加载，或者您想更换，您必须修改以下内容：

heheda/css/main.css 第187行url后面括号内的链接

heheda/css/main.css 第188行url后面括号内的链接

heheda/css/main.css 第189行url后面括号内的链接

heheda/css/main.css 第190行url后面括号内的链接

将上面指出的链接[https://cartoon.heheda.top/url.php]改为您指定的图片链接即可。

如果您想提升加载效率,您可以考虑进行以下操作

【非必须，小白勿操作！！！】

1.修改以下链接[https://cartoon.heheda.top]为您的图片链接的主域地址。

index.html 中第76行

index.html 中第80行

2.删除以下内容：

【注意仔细核对】

index.html 中第77行

index.html 中第81行

背景音乐

背景音乐是直接调用本地，可能占用服务器带宽。

注意：带宽小的服务器，建议使用外链的方式，否则可能导致主页无法加载！

1.您可以在‘index.html’文件的222行处修改。

2.若您不需要背景音乐，您也可以直接注释掉，这样它就不加载了。

您可以任意使用上面两种方法来改善您的项目，这是您的自由。

图标

项目应用的图标库地址：

• http://www.fontawesome.com.cn/faicons/

温馨提示

部分较新的图标可能不受支持，您可以更换相似的图标代替，或者提示我进行项目更新

常见问题

1.页面不加载（一直转圈圈）

这一般是背景图片没有加载或者超时。

2.背景音乐无声

请检查背景音乐是否加载。

---

部分源码

workbox.routing.registerRoute(
  ({event}) => event.request.destination === 'script',
  new workbox.strategies.StaleWhileRevalidate({
    cacheName: JS_CACHE,
    plugins: [
      new workbox.expiration.ExpirationPlugin({
        maxEntries: 15,
      }),
    ],
  })
);

workbox.routing.registerRoute(
  ({event}) => event.request.destination === 'style',
  new workbox.strategies.StaleWhileRevalidate({
    cacheName: STYLE_CACHE,
    plugins: [
      new workbox.expiration.ExpirationPlugin({
        maxEntries: 15,
      }),
    ],
  })
);

workbox.routing.registerRoute(
  ({event}) => event.request.destination === 'image',
  new workbox.strategies.StaleWhileRevalidate({
    cacheName: IMAGE_CACHE,
    plugins: [
      new workbox.expiration.ExpirationPlugin({
        maxEntries: 15,
      }),
    ],
  })
);

workbox.routing.registerRoute(
  ({event}) => event.request.destination === 'font',
  new workbox.strategies.StaleWhileRevalidate({
    cacheName: FONT_CACHE,
    plugins: [
      new workbox.expiration.ExpirationPlugin({
        maxEntries: 15,
      }),
    ],
  })
);

---

领取源码

关注下方公众号回复 漂亮主页（完全免费，只是关注一下公众号，作者整理不易

标签：heheda,导航页,二次元,源码,new,workbox,event,css
From： https://blog.csdn.net/m0_70474954/article/details/143195108