<script>
if (screen && screen.width >768 ) {
document.write('<script src="/dome.js" type="text/javascript"><\/script>');
}
</script>
用这个js 虽然可以实现 pc端 和 移动端的 判定执行。但框架调用则会失效。
需要达到 1个静态页,两次框架调用自适应模板,分别展示 pc端和移动端,但移动端中 有段js不需要执行。不知道该如何实现,
1、可以调整 iframe 调用属性 来实现
2、可以调整 js 判断来实现
3、如果有更好的方法也可参考。
如有会的大niu请详细告知具体写法,谢谢!
以下是我用的框架调用 仅供参考
<iframe id="iframe" src="../index.html" frameborder="0" width="100%"></iframe>
<div id='mobileFrame' class='' style='position: absolute; z-index: 999; width: 297px; height: 420px; right: 40px; bottom: 20px; padding: 32px 8px; background-image: url(/dome/img/small_phone.png);'>
<div id='hidemobile'>×</div>
<iframe src="../index.html" frameborder='0' style='width: 297px; height: 400px;' allowfullscreen></iframe>
</div>
<div id="showmobile" style="position: absolute; right: 16px; bottom: 200px; z-index: 999; width: 47px; height: 60px; cursor: pointer; display: none; background-image: url(/dome/img/phoneTip_right.png);">
</div>
var userAgentInfo = navigator.userAgent;
var mobileAgents = ["Android", "iPhone", "SymbianOS", "Windows Phone", "iPad", "iPod"];
然后就可以判断啦,另外可以通过分辨率判断,这样比较严谨
响应式? 还是 移动端 和pc 用的不是一个 js文件 需要 获取 设备 信息来判断 是哪个端
/**
* 判断设备是否android
* @returns {boolean}
*/
function isAndroid(){
let u = navigator.userAgent;
let isAndroid = u.indexOf('Android') > -1 || u.indexOf('Adr') > -1; //android终端
//let isiOS = !!u.match(/\(i[^;]+;( U;)? CPU.+Mac OS X/); //ios终端
return isAndroid;
}
/**
* 判断设备是否ios
* @returns {boolean}
*/
function isIos(){
let u = navigator.userAgent;
let isiOS = !!u.match(/\(i[^;]+;( U;)? CPU.+Mac OS X/); //ios终端
return isiOS;
}