判断pc端还是移动,并给移动加上其它的样式文件方法
所有移动端PC端 按 640 进行排版
body, html {
width: %;
height: %;
overflow: hidden;
background-color: #;
}
body{
height: %;
overflow: hidden;
box-shadow: 160px #5C99E7;
background-color: #fff;
position:relative;
}
.app {
width: 640px;
margin: auto;
box-sizing: border-box;
overflow:hidden;
}
<body class="app"></div>
<script type="text/javascript">
if(/Android (\d+\.\d+)/.test(navigator.userAgent)){
var version = parseFloat(RegExp.$);
if(version>2.3){
var phoneScale = parseInt(window.screen.width)/;
document.write('<meta name="viewport" content="width=640, minimum-scale = '+ phoneScale +', maximum-scale = '+ phoneScale +', target-densitydpi=device-dpi">');
}else{
document.write('<meta name="viewport" content="width=640, target-densitydpi=device-dpi">');
}
}else{
document.write('<meta name="viewport" content="width=640, user-scalable=no, target-densitydpi=device-dpi">');
}
//微信去掉下方刷新栏
if(navigator.userAgent.indexOf('MicroMessenger') >= ){
document.addEventListener('WeixinJSBridgeReady', function() {
//WeixinJSBridge.call('hideToolbar');
});
}
</script>
************移动pc端分别加载不同的网页方法***************
<script>
function isMobile(){try{var $=window.location.hash;if(!$.match("fromapp"))if((navigator.userAgent.match(/(iPhone|iPod|Android|ios|iPad|Mobile)/i)))return true}catch(_){}return false}
!!isMobile()&&(document.location.href="./mobile/");
if(!-[,]){document.location.href="./html/"};
</script>
1、<script>
function IsPC() {
var userAgentInfo = navigator.userAgent;
var Agents = new Array("Android", "iPhone", "SymbianOS", "Windows Phone", "iPad", "iPod");
var flag = true;
for (var v = 0; v < Agents.length; v++) {
if (userAgentInfo.indexOf(Agents[v]) > 0) { flag = false; break; }
}
return flag;
}
if (!IsPC()) {
<%--respond样式--%>
$("head").append('<link href="/Css/media.css" rel="stylesheet" />');
}
</script>
2、meta name="viewport" 的设置方法
<script type="text/javascript">
if(/Android (\d+\.\d+)/.test(navigator.userAgent)){
var version = parseFloat(RegExp.$1);
if(version>2.3){
var phoneScale = parseInt(window.screen.width)/640;
document.write('<meta name="viewport" content="width=640, minimum-scale = '+ phoneScale +', maximum-scale = '+ phoneScale +', target-densitydpi=device-dpi">');
}else{
document.write('<meta name="viewport" content="width=640, target-densitydpi=device-dpi">');
}
}else{
document.write('<meta name="viewport" content="width=640, user-scalable=no, target-densitydpi=device-dpi">');
} </script>
判断pc端还是移动,并给移动加上其它的样式文件方法的更多相关文章
- js 判断pc端或手机端
<script> (function () { var navUA = navigator.userAgent; var defIncludeStr = "iPhone|Andr ...
- 滚动条大于120px时,判断pc端的情况下,导航条固定定位
//滚动条大于120px时,判断pc端的情况下,导航条固定定位 $(window).scroll(function(){ var viewWidth=$(document).width() var ...
- 判断pc端或移动端并跳转
判断pc端或移动端并跳转 代码目录: index.html代码: <!DOCTYPE html> <html lang="en"> <head> ...
- js判断PC端与移动端跳转
在网上看到很多这样类似的代码,但是有的很复杂,或者有的没有判断完全,上次经理去见完客户回来讲,使用苹果浏览打开pc端(pc已经做了识别跳转)会自动跳转到移动端的网页去,后来经测试才发现 documen ...
- Java判断PC端还是移动端
package com.*.*.*; import java.io.IOException;import java.util.regex.Matcher;import java.util.regex. ...
- 多种方式判断PC端,IOS端,移动端
1. 通过判断浏览器的userAgent,用正则来判断手机是否是IOS(苹果)和Android(安卓)客户端. var u = navigator.userAgent; var isAndroid = ...
- 自动判断PC端、手机端跳往不同的域名JS实现代码
输入相同域名,在pc端和移动端会出现不同的页面效果,一种是用栅格系统实现自适应, 更多的是设计两套不同的模板和两个二级域名或者一个主域名和一个二级域名(就是有区别就可以了); js代码判断浏览器的用户 ...
- jquery简单判断PC端还是移动端
$(function(){ if (!navigator.userAgent.match(/mobile/i)) { //PC端 }else{ //移动端 } })
- js判断PC端 移动端 并跳转到对应页面
一.PC端跳转到移动端 html页面: <script>var webroot="/",catid="{$catid}",murl="m/ ...
随机推荐
- Javaweb三大组件之过滤器filter
Filter的三个方法 void init(FilterConfig):在Tomcat启动时被调用: void destroy():在Tomcat关闭时被调用: void doFilter(Servl ...
- 【SQL 触发器】
一.MySQL上触发器的使用 示例: CREATE TRIGGER trigger_name trigger_time trigger_event ON tbl_name FOR EACH ROW t ...
- AngularJS学习之模块
1.模块定义了一个应用程序:模块是应用程序中不同部分的容器:模块是应用控制器的容器:控制器通常属于一个模块 2.创建模块:你可以通过AngularJS的angular.module函数来创建模块: & ...
- AngularJS学习之SQL
1.使用PHP从MySQL中读取数据: <div ng-app="myApp" ng-controller="customersCtrl" > &l ...
- BZOJ 2049 [Sdoi2008]Cave 洞穴勘测 ——Link-Cut Tree
[题目分析] LCT另一道题目,很裸,许多操作都不需要,写起来很爽. [代码] #include <cstdio> #include <cstring> #include &l ...
- JavaScript实现li隔行变色
<!DOCTYPE html> <html> <head lang="en"> <meta charset="UTF-8&quo ...
- jQuery入门第三天
每个HTML元素根据继承属性都有父parent元素. 举个例子,h3 元素的父元素是 <div class="container-fluid">,<div cla ...
- Codeforces Round #353 (Div. 2) A. Infinite Sequence
Vasya likes everything infinite. Now he is studying the properties of a sequence s, such that its fi ...
- Windows 8 Tips
Precisely this article is about Windows 8.1, the title uses Windows 8 due to the fact that Windows 8 ...
- ACM 一种排序
一种排序 时间限制:3000 ms | 内存限制:65535 KB 难度:3 描述 现在有很多长方形,每一个长方形都有一个编号,这个编号可以重复:还知道这个长方形的宽和长,编号.长.宽都是整数 ...