专题页面跳转pc/移动端互转

159 阅读1分钟

theme: v-green

一、专题页面移动端、pc端互转

如为双端页面,需要自动判断跳转,PC访问移动端页面,跳转到对应的PC专题上,反之亦然。

PC端添加:

(function() {
if(/Android|webOS|iPhone|iPad|iPod|BlackBerry/i.test(navigator.userAgent)){
var a = document.referrer,
b={"baidu.com":"seo_baidu","sogou.com":"seo_sogou","sm.cn":"seo_sm","so.com":"seo_360","bing.com":"seo_bing","google.com":"seo_google"},
c;
for(c in b){
if(-1!=a.indexOf(c)){
a=b[c];
if(window.sessionStorage){sessionStorage.setItem("channel",a)}
else{
  var d=d||0,b="";0!=d&&(b=new Date,b.setTime(b.getTime()+1000*d),b="; expires="+b.toGMTString());document.cookie="channel="+escape(a)+b+"; path=/"}
  break
  }}
  window.location.href="/m/"+location.search};
})();

移动端添加:

if(!/Android|webOS|iPhone|iPad|iPod|BlackBerry/i.test(navigator.userAgent)) {
    window.location.href = "PC端专题地址"+location.search;
}

https协议自适应

图片的链接去掉http协议部分,采用协议自适应

<style>
//CSS背景图片 
.bg{background: url(//game.gtimg.cn/images/cf/cp/a20161021sqjs/hd.jpg) no-repeat;}
</style>
//链接URL
<a href="//cf.qq.com/main.shtml">进入官网</a>
//图片SRC
<img src="//game.gtimg.cn/images/cf/web201610/logo.png">
//JS链接
<script src="//ossweb-img.qq.com/images/js/title.js"></script>

参考:tgideas.qq.com/doc/fronten…