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. WPF 基础 - MultiBinding

    MultiBinding 与 Binding 一样继承自 BindingBase,因此可以使用 Binding 的地方都可以使用 MultiBinding. namespace System.Wind ...

  2. Cloudam云端,探索高性能计算在药物研究领域的解决方案

    近日,Cloudam云端与国内某知名药企与合作,通过接入Cloudam云端自主研发的云E云超算服务,计算效率提高的数百倍.这也是云算力在生命科学领域的又一次成功应用.Cloudam云端云E云超算服务是 ...

  3. 2019HDU多校第七场 HDU6646 A + B = C 【模拟】

    一.题目 A + B = C 二.分析 比较考验码力的题. 对于$c$,因为首位肯定不为0,那么$a$或者$b$至少有一个最高位是和$c$平齐的,或者少一位(相当于$a$+$b$进位得到). 那么这里 ...

  4. All I know about A/B Test (1) : 均值型指标与比值(率)型指标的计算区别

    因为最近在找实习,所以打算把自己之前学过的关数据分析的知识总结(复习)一下.在总结A/B test时,我发现中文互联网中关于A/B test的总结已经很多了,但是对于均值型指标和比值(率)型指标在设计 ...

  5. 用 Go + WebSocket 快速实现一个 chat 服务

    前言 在 go-zero 开源之后,非常多的用户询问是否可以支持以及什么时候支持 websocket,终于在 v1.1.6 里面我们从框架层面让 websocket 的支持落地了,下面我们就以 cha ...

  6. 为科学计算而生的Julia——基于Manjaro Linux的安装与入门

    技术背景 Julia是一门为科学计算而生的编程语言,其着重强调了开源.生态与性能.从开源角度来说,相比于Matlab就要友好很多,用户可以免费使用,而且MIT协议应该是最宽松的开源协议之一(截图来自于 ...

  7. 尝试做一个.NET简单、高效、避免OOM的Excel工具

    Github : https://github.com/shps951023/MiniExcel 简介 我尝试做一个.NET简单.高效.避免OOM的Excel工具 目前主流框架大多将资料全载入到记忆体 ...

  8. CodeForces CF862E题解

    \(Part\ 1:\) 我们发现每次修改动的是\(a\)串,所以对于这个答案的公式,\(b_{i+j}\)的部分是可以求出来的.所以我们可以把公式改成如下所示: \(f(j)=|\sum_{i=1} ...

  9. Echarts4.x雷达图如何展示一维数据?

    最近做的项目其中一个功能是画雷达图,鼠标滑过雷达图的拐点,展示该维相关数据,并且需要显示雷达图的刻度. 但是我发现单纯的雷达图似乎没办法展示一维数据. 我总结了一下,关于画雷达图,我遇到的难点有三个: ...

  10. 2020-BUAA OO-面向对象设计与构造-HW11中对ageVar采用缓存优化的等价性证明(包括溢出情况)

    HW11中对ageVar采用缓存优化的等价性证明(包括溢出情况) 概要 我们知道,第三次作业里age上限变为2000,而如果缓存年龄的平方和,2000*2000*800 > 2147483647 ...