当前位置: 首页 > 编程笔记 >

JS判断移动端访问设备并加载对应CSS样式

澹台正业
2023-03-14
本文向大家介绍JS判断移动端访问设备并加载对应CSS样式,包括了JS判断移动端访问设备并加载对应CSS样式的使用技巧和注意事项,需要的朋友参考一下
JS判断不同web访问环境,主要针对移动设备,提供相对应的解析方案(判断设备代码直接copy腾讯网的)
 
// 判断是否为移动端运行环境 

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)){ 

// 判断访问环境是 Android|webOS|iPhone|iPod|BlackBerry 则加载以下样式 

setActiveStyleSheet("style_mobile_a.css"); 

} 

else if(/iPad/i.test(navigator.userAgent)){ 

// 判断访问环境是 iPad 则加载以下样式 

setActiveStyleSheet("style_mobile_iPad.css"); 

} 

else{ 

// 判断访问环境是 其他移动设备 则加载以下样式 

setActiveStyleSheet("style_mobile_other.css"); 

} 

} 

catch(e){} 

} 

} 

else{ 

// 如果以上都不是,则加载以下样式 

setActiveStyleSheet("style_mobile_no.css"); 

} 

// 判断完毕后加载样式 

function setActiveStyleSheet(filename){document.write("<link href="+filename+" rel=stylesheet>");} 

加载页面
 
<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> 
 类似资料:
  • 本文向大家介绍javascript判断移动端访问设备并解析对应CSS的方法,包括了javascript判断移动端访问设备并解析对应CSS的方法的使用技巧和注意事项,需要的朋友参考一下 本文实例讲述了javascript判断移动端访问设备并解析对应CSS的方法。分享给大家供大家参考。具体分析如下: javascript判断不同web访问环境,主要针对移动设备,提供相对应的解析方案(判断设备代码直接c

  • 本文向大家介绍JS实现判断移动端PC端功能,包括了JS实现判断移动端PC端功能的使用技巧和注意事项,需要的朋友参考一下 这篇文章主要介绍了JS实现判断移动端PC端功能,文中通过示例代码介绍的非常详细,对大家的学习或者工作具有一定的参考学习价值,需要的朋友可以参考下 博客上的小精灵看起来很可耐,用了两年了现在才知道用移动端看的话会挡着屏幕,既然知道了就要改进咯。 判断是pc 还是移动端 或者 以上就

  • 问题内容: 我试图使我的自适应CSS样式 仅 在平板电脑和智能手机上起作用。基本上,我有一种桌面风格,一种移动风格:肖像风格和一种移动风格:风景风格。我完全不希望移动样式干扰桌面演示。我玩过无数次媒体查询,但是结果要么移动样式显示在桌面上,要么移动样式仅显示在移动设备上,但只有一组规则(无响应)。有什么办法可以将两者完全分开吗? 我现在拥有的代码如下所示: 问题答案: 您所拥有的一切应该可以正常工

  • 本文向大家介绍php函数实现判断是否移动端访问,包括了php函数实现判断是否移动端访问的使用技巧和注意事项,需要的朋友参考一下 忘记在哪里获取的函数了,刚才不了心在一个包里面找到,临时保存起来 非常简单实用的函数,分享给大家,希望大家能够喜欢。

  • 本文向大家介绍javaweb判断当前请求是否为移动设备访问的方法,包括了javaweb判断当前请求是否为移动设备访问的方法的使用技巧和注意事项,需要的朋友参考一下 这段时间都是在做pc端的业务,结果经理找到我说,可能要做移动端的应用,后台逻辑还是用我写的逻辑,但是需要改动一些,看看怎么处理。 由于移动端和pc端还是稍微有些区别的,我觉得最好是在一个地儿统一判断,而且不要改动原先的代码,这样可以从一

  • 本文向大家介绍在css加载完毕后自动判断页面是否加入css或js文件,包括了在css加载完毕后自动判断页面是否加入css或js文件的使用技巧和注意事项,需要的朋友参考一下 最近在写项目的framework,写个JQueryMessageBox的类,以使用jquery ui中的dialog()来显示消息框,为了使方法方便调用,便加入了自动判断页面是否加入了ui.js和ui.css,代码如下: 但CS