手机平板等移动端适配跳转URL的js代码

<script type="text/javascript">
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="手机页面";
            }else if(/iPad/i.test(navigator.userAgent)){
                window.location.href="平板页面";
            }else{
                window.location.href="其他移动端页面"
            }
        }catch(e){}
    }
}
</script>
function uaredirect(f){try{if(document.getElementById("bdmark")!=null){return}var b=false;if(arguments[1]){var e=window.location.host;var a=window.location.href;if(isSubdomain(arguments[1],e)==1){f=f+"/#m/"+a;b=true}else{if(isSubdomain(arguments[1],e)==2){f=f+"/#m/"+a;b=true}else{f=a;b=false}}}else{b=true}if(b){var c=window.location.hash;if(!c.match("fromapp")){if((navigator.userAgent.match(/(iPhone|iPod|Android|ios)/i))){location.replace(f)}}}}catch(d){}}function isSubdomain(c,d){this.getdomain=function(f){var e=f.indexOf("://");if(e>0){var h=f.substr(e+3)}else{var h=f}var g=/^www\./;if(g.test(h)){h=h.substr(4)}return h};if(c==d){return 1}else{var c=this.getdomain(c);var b=this.getdomain(d);if(c==b){return 1}else{c=c.replace(".","\\.");var a=new RegExp("\\."+c+"$");if(b.match(a)){return 2}else{return 0}}}};
<script type="text/javascript">uaredirect("你的手机版网址");</script>

手机平板等移动端适配跳转URL的js代码

时间: 2024-11-10 07:50:23

手机平板等移动端适配跳转URL的js代码的相关文章

js判断是否是移动端自动跳转到wap页面代码

<script type="text/javascript"> function is_mobile(){ var regex_match=/(nokia|iphone|android|motorola|^mot-|softbank|foma|docomo|kddi|up.browser|up.link|htc|dopod|blazer|netfront|helio|hosin|huawei|novarra|CoolPad|webos|techfaith|palmsourc

移动端适配方案研究

初次接触移动端的时候,以为终于可以不用像pc那样考虑令人头疼的ie浏览器兼容问题,有强大的css3的帮助,可以随心所欲..可是后来才发现原来移动端各种层次不齐的终端更会让人抓耳挠腮,同样的页面在不同的手机上显示的完全不一样的效果,于是抛开功能,页面适配性也成了一个大的课题. 说到移动端,下面这一行代码大家一定不陌生: <meta name="viewport" content="width=device-width, initial-scale=1, maximum-s

移动端适配知识梳理

了解移动端的知识 viewportviewport是用户网页的可视区域.手机浏览器是把页面放在一个虚拟的"窗口"(viewport)中,通常这个虚拟的"窗口"(viewport)比屏幕宽,这样就不用把每个网页挤到很小的窗口中(这样会破坏没有针对手机浏览器优化的网页的布局),用户可以通过平移和缩放来看网页的不同部分. 像素css中的像素只是一个抽象的单位,早期的手机屏幕像素密度较低,一个css像素等于一个物理像素.但是随着手机的屏幕像素密度越来越高,比如Retina,

移动端适配之雪碧图(sprite)背景图片定位

为了减少网络请求个数量,提高网站的访问速度,我们一般都会把一些小的图片合并成一张sprite图,然后根据background-position来进行定位.在web端由于是固定的大小与left .top,所以定位起来会比较准确.简单.但是在移动端就不一样了,各种手机的屏幕大小不一样,很难做到使用sprite图然后根据background-position来定位.所以普遍的做法都是使用单张图片,然后使用background-size: cover|100%|contain来控制背景图的大小.其实这样

移动端适配方案以及rem和px之间的转换

背景 开发移动端H5页面 面对不同分辨率的手机 面对不同屏幕尺寸的手机 视觉稿 在前端开发之前,视觉MM会给我们一个psd文件,称之为视觉稿. 对于移动端开发而言,为了做到页面高清的效果,视觉稿的规范往往会遵循以下两点: 1)首先,选取一款手机的屏幕宽高作为基准(以前是iPhone4的320×480,现在更多的是iphone6的375×667). 2)对于retina屏幕(如: dpr=2),为了达到高清效果,视觉稿的画布大小会是基准的2倍,也就是说像素点个数是原来的4倍(对iphone6而言:

移动端适配之rem 笔记

/*移动端适配 width|height|font-size = 视觉稿量出来的值 / 100rem;@lbl*/ @media screen and (max-width:359px) and (min-width:320px) { html,body{ font-size: 50px !important; } } @media screen and (max-width:374px) and (min-width:360px) { html,body{ font-size: 56.25px

移动端适配之REM

随着手机等移动设备的普及,移动端带来的流量已经不可忽视,一个网站不只是只有pc的页面就足够了,移动端的适配已经势在必行.但是移动设备种类繁多,屏幕尺寸也千奇百怪,能不能找到一种方式可以适配所有的手机屏幕呢? 答案就是rem. 俗话说 “授人以鱼不如授人以渔”,但今天我就反其道而行,就是授人以鱼的.因为要跟你说什么设备像素比.css像素.ppi等东西,估计你会晕的(主要是我也搞不懂).废话不多说,先上代码. 1 /*移动端适配 width|height|font-size = 视觉稿量出来的值 /

移动端适配难点

1.移动端开发通常都会在html中写下以下的meta标签 <meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=0"> 需要注意的是无论是这样写还是用淘宝flexible.js动态生成meta头,目的只有一个,那就是让布局视口等于苹果手机的分辨率宽高/设备像素比后的宽高.苹果手机的分辨率是指以下所示 而不

前端开发知识之前端移动端适配总结

meta标签到底做了什么事情 做过移动端适配的小伙伴一定有遇到过这行代码: <meta name="viewport" content="width=device-width, initial-scale=1.0"> 但是,很多小伙伴只是感性的认识:噢,我加了这行代码,然后页面的宽度就会跟我的设备宽度一致.然而,这种理解是很片面的.那么,这句话的本质到底是什么呢? 不急,我们先往下面看,这里先留个悬念. 几个专有名词和单位 这里,我们先来辨析一下在适配的