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. 谈谈注册中心 zookeeper 和 eureka中的CP和 AP

    谈谈注册中心 zookeeper 和 eureka中的CP和 AP 前言 在分布式架构中往往伴随CAP的理论.因为分布式的架构,不再使用传统的单机架构,多机为了提供可靠服务所以需要冗余数据因而会存在分 ...

  2. rest framework Views

    基于类的意见 Django的基于类的意见是从旧式的观点颇受欢迎. - Reinout面包车里斯 REST框架提供了一个APIView类,它的子类Django的View类. APIView类是从正规不同 ...

  3. FreeBSD 镜像站问题 @2021

    主要问题在于官方无论如何也不开放 rsync 且不接受镜像站的官方二级镜像申请. 多次联系均无二次联系,如邮件列表,大概五次,其中三次回应,两次无回应.其主要回复内容为"深表歉意,但台湾地区 ...

  4. Java基础:运算符

    算数运算符:+,-,*,/,%,++,-- 赋值运算符:= 关系运算符:>,<,>=,<=,==,!=,instanceof 逻辑运算符:&&,||,! 位运算 ...

  5. Java传参:值传递 or 引用传递 ?

    刚开始学Java的时候一度以为:基本数据类型是值传递,引用类型是引用传递.新人很容易在这两个概念上面被搞糊涂,后来看了Hollis的文章才明白了Java中只有值传递. 接下来我能用简单明了的方式来说明 ...

  6. windows程序员开发linux程序的头一个月

    开发环境选择 vim,vscode,qt,visual studio都可以做linux c++开发,但是作为windows程序员,最熟悉的还是visual stuio,加上visual studio ...

  7. Python之基础算法介绍

    一.算法介绍 1. 算法是什么 算法是指解题方案的准确而完整的描述,是一系列解决问题的清晰指令,算法代表着用系统的方法描述解决问题的策略机制.也就是说,能够对一定规范的输入,在有限时间内获得所要求的输 ...

  8. 简单ping确定网络故障

    1.ping localhost (127.0.0.1) 目的:确定TCP/IP有无问题 2.ping本机地址 用来检测网卡驱动有无问题 如何获取本机地址? win+r cmd 输入ipconfig/ ...

  9. 4、MyBatis教程之配置解析

    5.配置解析 核心配置文件 mybatis-config.xml 系统核心配置文件 MyBatis 的配置文件会深深影响 MyBatis 行为的设置和属性信息. 能配置的内容如下: configura ...

  10. 比Django官方实现更好的分页组件+Bootstrap整合

    前言 Django全家桶自带的分页组件只能说能满足分页这个功能,但是没那么好用就是了 Django的分页效果 django-pure-pagination分页效果 使用方法 首先安装: pip ins ...