【hugo】- hugo 监听浏览器切换title

不打扰是莪最后的温柔 提交于 2020-01-30 12:52:57

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-->
标签
易学教程内所有资源均来自网络或用户发布的内容,如有违反法律规定的内容欢迎反馈
该文章没有解决你所遇到的问题?点击提问,说说你的问题,让更多的人一起探讨吧!