网页制作——手机端与PC端兼容
手机端与PC端使用一套代码时,随屏幕分辨率的大小变化,会产生媒体查询并实现手机端与PC端的切换
(一套代码)
<meta http-equir=”Cache-control”content=”no-transform”/>
<meta http-equir=”Cache-control”content=”n-siteapp”/>
<meta name=”viewport” content=”maximum-scale=5.0,minimum-scale=1.0,user-scalable=no”>
用JavaScript代码判断使用端是什么
if( !IsPC){ //flag为false才进if,即为手机端时,才加上<link>的媒体查询的css样式
varstr=”<link rel=’stylesheet’ href=’./css/medial.css’/>”;
document.getElementsByTagName(“head”)[0].innerHTML+= str;
}
function IsPC(){
varuserAgentInfo = navigator.userAgent; // navigator.userAgent返回的是Netscape
varAgents = [“Android”,”iPhone”,”SymbianOS”,”windows Phone”,”iPod”,”iPad”];
varflag = true;
for(varv=0;v<Agents.length;v++){
if(userAgentInfo.indexOf(Agents[v]>0)){
flag = false; //为手机端,将flag改为false,并返回flag值
break;
}
}
return flag;
}