根据判断浏览器类型屏幕分辨率自动调用不同CSS的代码


Posted in Javascript onFebruary 22, 2007

既判断分辨率,也判断浏览器 

重新完善代码,使之成为判断浏览器类型屏幕分辨率自动调用不同CSS的代码。

<SCRIPT LANGUAGE="JavaScript"> 
<!-- 
if (window.navigator.userAgent.indexOf("MSIE")>=1) 
{ 
var IE1024=""; 
var IE800=""; 
var IE1152=""; 
var IEother=""; ScreenWidth(IE1024,IE800,IE1152,IEother) 
}else{ 
if (window.navigator.userAgent.indexOf("Firefox")>=1) 
{ 
//如果浏览器为Firefox 
var Firefox1024=""; 
var Firefox800=""; 
var Firefox1152=""; 
var Firefoxother=""; 
ScreenWidth(Firefox1024,Firefox800,Firefox1152,Firefoxother) 
}else{ 
//如果浏览器为其他 
var Other1024=""; 
var Other800=""; 
var Other1152=""; 
var Otherother=""; 
ScreenWidth(Other1024,Other800,Other1152,Otherother) 
} 
} 
function ScreenWidth(CSS1,CSS2,CSS3,CSS4){ 
if ((screen.width == 1024) && (screen.height == 768)){ 
setActiveStyleSheet(CSS1); 
}else{ 
if ((screen.width == 800) && (screen.height == 600)){ 
setActiveStyleSheet(CSS2); 
}else{ 
if ((screen.width == 1152) && (screen.height == 864)){ 
setActiveStyleSheet(CSS3); 
}else{ 
setActiveStyleSheet(CSS4); 
}}} 
} 
function setActiveStyleSheet(title){  
 document.getElementsByTagName("link")[0].href="style/"+title;  
} 
//--> 
</SCRIPT>

解释:

var IE1024="";
var IE800="";
var IE1152="";
var IEother="";

引号里面分别填写,用户使用IE的时候并且分辨率为1024*768,800*600,1152*864要使用的css文件名. 

var Firefox1024="";
var Firefox800="";
var Firefox1152="";
var Firefoxother="";

引号里面分别填写,用户使用FF的时候并且分辨率为1024*768,800*600,1152*864要使用的css文件名.

var Other1024="";
var Other800="";
var Other1152="";
var Otherother="";

引号里面分别填写,用户使用其他浏览器的时候并且分辨率为1024*768,800*600,1152*864要使用的css文件名.

不判断分辨率,只判断浏览器 

实现根据浏览器类型自动调用不同CSS。

<SCRIPT LANGUAGE="JavaScript"> 
<!-- 
if (window.navigator.userAgent.indexOf("MSIE")>=1) 
{ 
//如果浏览器为IE 
setActiveStyleSheet("default.css"); 
}else{ 
if (window.navigator.userAgent.indexOf("Firefox")>=1) 
{ 
//如果浏览器为Firefox 
setActiveStyleSheet("default2.css"); 
}else{ 
//如果浏览器为其他 
setActiveStyleSheet("newsky.css"); 
} 
} function setActiveStyleSheet(title){  
 document.getElementsByTagName("link")[0].href="style/"+title;  
} 
//--> 
</SCRIPT>

解释:
如果浏览器为IE,则调用default.css
如果浏览器为Firefox,则调用default2.css
如果浏览器为其他,则调用newsky.css

用法:
放在
[codes=xml]</head>[/codes]
前面即可。

只判断分辨率,不判断浏览器 

<script language=javascript>  
<!-- 
if (screen.width == 800) 
{ 
document.write('<link rel=stylesheet type="text/css" href="css800.css">') 
} 
else {document.write('<link rel=stylesheet type="text/css" href="css1024.css">')} 
//--> 
</script>
 
Javascript 相关文章推荐
javascript支持firefox,ie7页面布局拖拽效果代码
Dec 20 Javascript
基于jQuery的获得各种控件Value的方法
Nov 19 Javascript
利用JS自动打开页面上链接的实现代码
Sep 25 Javascript
jQuery中获取checkbox选中项等操作及注意事项
Nov 24 Javascript
JavaScript实现的encode64加密算法实例分析
Apr 15 Javascript
Angular 4.X开发实践中的踩坑小结
Jul 04 Javascript
element ui里dialog关闭后清除验证条件方法
Feb 26 Javascript
JS获取input[file]的值并显示在页面的实现方法
Mar 09 Javascript
解决vue2.0路由跳转未匹配相应用路由避免出现空白页面的问题
Aug 24 Javascript
vue路由守卫+登录态管理实例分析
May 21 Javascript
layui写后台表格思路和赋值用法详解
Nov 14 Javascript
JS如何判断对象是否包含某个属性
Aug 29 Javascript
用YUI做了个标签浏览效果
Feb 20 #Javascript
懒就要懒到底——鼠标自动点击(含时间判断)
Feb 20 #Javascript
初探jquery——表单应用范例
Feb 20 #Javascript
动态调用css文件——jquery的应用
Feb 20 #Javascript
js压缩利器
Feb 20 #Javascript
通过jquery实现tab标签浏览效果
Feb 20 #Javascript
用jquery来定位
Feb 20 #Javascript
You might like
6个超实用的PHP代码片段
2015/08/10 PHP
php获取远程文件大小
2015/10/20 PHP
浅谈PHP发送HTTP请求的几种方式
2017/07/25 PHP
javascript错误的认识不用关心内存管理
2012/12/15 Javascript
javascript模拟枚举的简单实例
2014/03/06 Javascript
JavaScript计算两个日期时间段内日期的方法
2015/03/16 Javascript
jq实现左侧显示图片右侧文字滑动切换效果
2015/08/04 Javascript
js实现的二分查找算法实例
2016/01/21 Javascript
Spring MVC中Ajax实现二级联动的简单实例
2016/07/06 Javascript
javascript类型系统——undefined和null全面了解
2016/07/13 Javascript
JavaScript中ES6字符串扩展方法
2016/08/26 Javascript
关于foreach循环中遇到的问题小结
2017/05/08 Javascript
jQuery使用bind函数实现绑定多个事件的方法
2017/10/11 jQuery
vue 动态修改a标签的样式的方法
2018/01/18 Javascript
如何在 JavaScript 中更好地利用数组
2018/09/27 Javascript
在Create React App中启用Sass和Less的方法示例
2019/01/16 Javascript
python虚拟环境 virtualenv的简单使用
2020/01/21 Javascript
JavaScript类的继承多种实现方法
2020/05/30 Javascript
vue离开当前页面触发的函数代码
2020/09/01 Javascript
linux服务器快速卸载安装node环境(简单上手)
2021/02/22 Javascript
Python实现解析Bit Torrent种子文件内容的方法
2017/08/29 Python
python购物车程序简单代码
2018/04/18 Python
pygame游戏之旅 添加游戏介绍
2018/11/20 Python
CentOS下Python3的安装及创建虚拟环境的方法
2018/11/28 Python
分享8个非常流行的 Python 可视化工具包
2019/06/05 Python
Python colormap库的安装和使用详情
2020/10/06 Python
发现两个有趣的CSS3动画效果
2013/08/14 HTML / CSS
Tea Collection官网:一家位于旧金山的童装公司
2020/08/07 全球购物
2014年应届大学生毕业自我鉴定
2014/01/31 职场文书
GMP办公室主任岗位职责
2014/03/14 职场文书
眼镜促销方案
2014/03/15 职场文书
企业安全生产演讲稿
2014/05/09 职场文书
政协会议宣传标语
2014/10/09 职场文书
幼儿教师小班个人总结
2015/02/05 职场文书
2015年检验科工作总结
2015/04/27 职场文书
七一表彰大会简报
2015/07/20 职场文书