前言

可以在切换至其他网页时动态修改网站的标题,引起访问者的注意,当再次回来时修改网站标题表示欢迎;

操作方法

新建脚本文件

Root\source\js\title.js,写入一下内容:

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
//动态标题
var OriginTitile = document.title;
var titleTime;
document.addEventListener('visibilitychange', function () {
if (document.hidden) {
//离开当前页面时标签显示内容
document.title = '👀不要走嘛~';
clearTimeout(titleTime);
} else {
//返回当前页面时标签显示内容
document.title = '🐖欢迎你回来~';
//两秒后变回正常标题
titleTime = setTimeout(function () {
document.title = OriginTitile;
}, 2000);
}
});

引用脚本文件

在主题配置文件_config.butterfly.yml引入该文件:

1
2
3
inject: 
bottom:
+ - <script async src="/js/title.js"></script>

查看和验证效果

1
2
3
hexo cl
hexo g
hexo s

参考链接:https://www.fomal.cc/posts/d1927166.html