hugo 博客 监听浏览器title 动态改变浏览器title标题

找到head.html

themes/maupassant/layouts/partials/head.html

添加监听js

可以从html中发现,分为home页面和其他页面,两种展示的不同,所以需要改这两部分

  {{ if .IsHome -}}
<title>{{ .Site.Title }} | {{ .Site.Params.subtitle}}</title>
<meta property="og:title" content="{{ .Site.Title }} | {{ .Site.Params.subtitle}}">
<meta property="og:type" content="website">
<meta name="Keywords" content="{{.Site.Params.keywords}}">
<meta name="description" content="{{ .Site.Params.description }}"> <!--添加部分-start--> <script>
document.addEventListener('visibilitychange',function(){
if( document.visibilityState == 'hidden' ){
normal_title = document.title;
document.title = 'ヽ(●-`Д´-)ノ你丑你就走!';
}else{
document.title = 'ヾ(Ő∀Ő3)ノ你帅就回来!';
setTimeout(function(){
document.title = normal_title;
}, 1200)
}
});
</script>
<!--添加部分-end--> {{- else -}}
<title>{{ .Title }} | {{ .Site.Title }}</title> <!--添加部分-start-->
<script>
document.addEventListener('visibilitychange',function(){
if( document.visibilityState == 'hidden' ){
normal_title = document.title;
document.title = 'ヽ(●-`Д´-)ノ你丑你就走!';
}else{
document.title = 'ヾ(Ő∀Ő3)ノ你帅就回来!';
setTimeout(function(){
document.title = normal_title;
}, 1200)
}
});
</script>
<!--添加部分-end-->

【hugo】- hugo 监听浏览器切换title的更多相关文章

  1. 监听浏览器tab切换

    监听浏览器切屏 为了完成验证用户在切换浏览器tab时进行登录再次认证需求需要监听浏览器切换窗口 if (document.hidden !== undefined) { document.addEve ...

  2. js监听浏览器tab窗口切换

    js监听浏览器tab窗口切换 ——IT唐伯虎 摘要:js监听浏览器tab窗口切换. if (document.hidden !== undefined) {  document.addEventLis ...

  3. 解决如何监听Activity切换

    本篇博文在我之前的博文中已经提到了,但是监听Activity切换又可以作为一个单独的内容来叙述,因此这里又单独拿了出来进行赘述. Activity的切换无非有两种,第一种:启动或者创建一个新的Acti ...

  4. JS实时监听浏览器宽度的变化

    boot:function(){ //加载页面时执行一次 changeMargin(); //监听浏览器宽度的改变 window.onresize = function(){ changeMargin ...

  5. vue监听浏览器窗口大小变化

    首先,页面初始化mounted的时候,通过 document.body.clientWidth 和 document.body.clientHeight 来获取到浏览器的宽和高,然后通过 window ...

  6. 解决怎样监听Activity切换

    本篇博文在我之前的博文中已经提到了,可是监听Activity切换又能够作为一个单独的内容来叙述,因此这里又单独拿了出来进行赘述. Activity的切换无非有两种.第一种:启动或者创建一个新的Acti ...

  7. vue JS实现监听浏览器返回按键事件

    // 这个是监听浏览器回退键的returnButton () { let vm = this; $(document).ready(function () { if (window.history & ...

  8. JS监听浏览器标签页的显示与隐藏

    /** * 监听浏览器标签页的显示与隐藏 */ class ListenerPageVisibility { constructor () { // 设置隐藏属性和改变可见属性的事件的名称 this. ...

  9. JS 监听浏览器各个标签间的切换

    以前看到过一些网页,在标签切换到其它地址时,网页上的标题上会发生变化,一直不知道这个是怎么做的,最近查了一些资料才发现有一个 visibilitychange 事件就可以搞定,这里将介绍一下页面可见性 ...

随机推荐

  1. FreeBSD Fcitx 输入法框架设置

    #FreeBSD# 在.cshrc和/etc/csh.cshrc中进行如下配置,此配置可以解决部分窗口fcitx无效的问题. setenv QT4_IM_MODULE fcitx setenv GTK ...

  2. TensorFlow学习(1)-初识

    初识TensorFlow 一.术语潜知 深度学习:深度学习(deep learning)是机器学习的分支,是一种试图使用包含复杂结构或由多重非线性变换构成的多个处理层对数据进行高层抽象的算法. 深度学 ...

  3. Python基础(2)——循环和分支[xiaoshun]

    一.瞎扯 世界上一切的系统都可以被'分支'表示.循环也是分支,只不过又重复之前的'分支'选择罢了.程序如人生,每一次的'分支',每一次的选择,都会有不同的结果: 有的选择止步不前,无限循环: 有的选择 ...

  4. python之commands和subprocess入门介绍(可执行shell命令的模块)

    一.commands模块 1.介绍 当我们使用Python进行编码的时候,但是又想运行一些shell命令,去创建文件夹.移动文件等等操作时,我们可以使用一些Python库去执行shell命令. com ...

  5. 这个Bug的排查之路,真的太有趣了。

    这是why哥的第 92 篇原创文章 在<深入理解Java虚拟机>一书中有这样一段代码: public class VolatileTest {    public static volat ...

  6. 《逆向工程核心原理》Windows消息钩取

    DLL注入--使用SetWindowsHookEx函数实现消息钩取 MSDN: SetWindowsHookEx Function The SetWindowsHookEx function inst ...

  7. 攻防世界 reverse parallel-comparator-200

    parallel-comparator-200 school-ctf-winter-2015 https://github.com/ctfs/write-ups-2015/tree/master/sc ...

  8. fork、exec 和 exit 对 IPC 对象的影响

    GitHub: https://github.com/storagezhang Emai: debugzhang@163.com 华为云社区: https://bbs.huaweicloud.com/ ...

  9. Android Studio中批量注释 Java代码

    •ctrl+/ 选中需要注释的多行代码,然后按 ctrl + / 实现多行快速注释: 再次按下 ctrl + / 取消注释. •ctrl+shift+/ 选中一行或几行代码,按 ctrl + shif ...

  10. 为了效率,我们可以用的招数 之 strlen

    如果要你写一个计算字符串长度的函数 strlen,应该怎么写?相信你很容易写出如下实现: 1 int strlen_1(const char* str) { 2 int cnt = 0; 3 4 if ...