今天水一下文章,说实在的最近太懒了,啥也学不进去,所以也只能玩玩这些被你们玩剩下的东西。

就是上图这个玩意,如果你当前页面在本站那就正常显示本站原始Title数据,如果离开本站那就显示自定义title数据为了更逼真所以你也可设置下ico。

代码就是一段js代码,用了document.hiddenvisibilitychange,就是HTML5的Page Visibility API,哈哈哈。

代码如下:

<script type="text/javascript">
			var ico = document.querySelector('link[rel="icon"]');  //获取原始ico属性
			var OriginTitile = document.title;
			var titleTime;
			document.addEventListener('visibilitychange', function() {
			    if (document.hidden) {
					ico.href='./xxx.ico';  //自定义离开页面ico地址
			        document.title = '此处为自定义内容' ;
			        clearTimeout(titleTime);
			    }
			    else {
					ico.href='./xxx.cio';  //此处为原始站点ico地址
			        document.title = '自定义内容'+OriginTitile;  //此处为原始站点title数据
			        titleTime = setTimeout(function() {
			            document.title = OriginTitile;
			        }, 2000);
			    }
			});
		</script>

其中需要自己修改的内容为代码中出现汉字的地方,如果不清楚可参考下面与上面配合修改

1.获取原始站点属性,方便下面逻辑操作

var ico = document.querySelector('link[rel="icon"]');   //此处要与你自己网站ico-link与之对应

2.此段为离开页面显示的修改

if (document.hidden) {
					ico.href='./xxx.ico';  //自定义离开页面ico地址
			        document.title = '此处为自定义内容' ;
			        clearTimeout(titleTime);
			    }

3.回到源站的显示

ico.href='。/xxx.cio';  此处为原始站点ico地址
			        document.title = '自定义内容'+OriginTitile;  //此处为原始站点title数据

其实就是很简单一段没有技术含量的js代码,之所以搞这么详细就是为了让文章字数多点显得美体(强迫症)

具体效果请参考本站效果(本站结合Phub,所以别误关~)


版权声明:

如未注明,均为原创,转载需注明出处!

本文链接:https://jkgblog.com/1140.html

最后修改日期:2020年8月19日

作者

留言

好久没更新了呢!

好厉害,先保存了

撰写回覆或留言

发布留言必须填写的电子邮件地址不会公开。