随着移动端浏览量占比大幅提升,如何打造一个自动识别屏幕尺寸的自适应网站,就变成了站长不得不解决的一个现实问题。网站自动识别手机端的方法有很多,但是对于新手来说很是复杂,而且调试起来很困难。下面麦布就教你一个很简单的自动识别手机端并跳转的响应式网站。
步骤一:进入百度开发者中心(http://siteapp.baidu.com/),利用siteapp来制作自己的手机网站,很简单,都是模板式建站,会打字就行。
步骤二:绑定一个专属webapp域名,例如:m.54admin.net,将您已提交的WebApp域名的CNAME解析到siteapp.baidu.com
步骤三:将自动识别手机端与PC端的代码放置在你网站代码的顶部位置。代码如下:
< type="text/java">
if(/AppleWebKit.*mobile/i.test(navigator.userAgent) || (/MIDP|SymbianOS|NOKIA|SAMSUNG|LG|NEC|TCL|Alcatel|BIRD|DBTEL|Dopod|PHILIPS|HAIER|LENOVO|MOT-|Nokia|SonyEricsson|SIE-|Amoi|ZTE/.test(navigator.userAgent))){
if(window.location.href.indexOf("?mobile")<0){
try{
if(/Android|webOS|iPhone|iPod|BlackBerry/i.test(navigator.userAgent)){
window.location.href="http://m.54admin.net";
}else if(/iPad/i.test(navigator.userAgent)){
window.location.href="http://m.54admin.net";
}else{
window.location.href="http://www.54admin.net"
}
}catch(e){}
}
}
</>
这样就大功告成了,是不是很简单呢?
欢迎关注站长网志(微信/QQ号:330419081,公众号:mybu_net),一起分享站长资源,探讨网站运营推广之道!
2、本站永久网址:https://www.yuanmacun.com
3、本网站的文章部分内容可能来源于网络,仅供大家学习与参考,如有侵权,请联系站长进行删除处理。
4、本站一切资源不代表本站立场,并不代表本站赞同其观点和对其真实性负责。
5、本站一律禁止以任何方式发布或转载任何违法的相关信息,访客发现请向站长举报
6、本站资源大多存储在云盘,如发现链接失效,请联系我们我们会第一时间更新。
源码村资源网 » 域名建设中代码(域名随机跳转代码)
1 评论