根据判断浏览器类型屏幕分辨率自动调用不同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 相关文章推荐
前台js改变Session的值(用ajax实现)
Dec 28 Javascript
jquery实现弹出层登录和全屏层注册特效
Aug 28 Javascript
JavaScript的ExtJS框架中表格的编写教程
May 21 Javascript
js判断checkbox是否选中个数的方法(超简单)
Aug 19 Javascript
AngularJS实现星星等级评分功能
Sep 24 Javascript
使用JavaScript获取Request中参数的值方法
Sep 27 Javascript
原生JS实现跑马灯效果
Feb 20 Javascript
javascript 中null和undefined区分和比较
Apr 19 Javascript
写给vue新手们的vue渲染页面教程
Sep 01 Javascript
基于JavaScript实现幸运抽奖页面
Jul 05 Javascript
JavaScript实现与使用发布/订阅模式详解
Jan 19 Javascript
JavaScript监听一个DOM元素大小变化
Apr 26 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
Look And Say 序列php实现代码
2011/05/22 PHP
php mail to 配置详解
2014/01/16 PHP
codeigniter自带数据库类使用方法说明
2014/03/25 PHP
php实现购物车功能(下)
2016/01/05 PHP
php cli模式下获取参数的方法
2017/05/05 PHP
PHP获取数据库表中的数据插入新的表再原删除数据方法
2018/10/12 PHP
JavaScript Sort 表格排序
2009/10/31 Javascript
javascript 事件处理、鼠标拖动效果实现方法详解
2012/05/11 Javascript
JavaScript中的style.display属性操作
2013/03/27 Javascript
从数据结构的角度分析 for each in 比 for in 快的多
2013/07/07 Javascript
jquery 鼠标滑动显示详情应用示例
2014/01/24 Javascript
node.js中使用socket.io的方法
2014/12/15 Javascript
jQuery实现仿美橙互联两级导航菜单效果完整实例
2015/09/17 Javascript
理解AngularJs指令
2015/12/10 Javascript
js密码强度检测
2016/01/07 Javascript
封装属于自己的JS组件
2016/01/27 Javascript
Vue.js bootstrap前端实现分页和排序
2017/03/10 Javascript
基于JS实现带动画效果的流程进度条
2018/06/01 Javascript
微信小程序自定义toast弹窗效果的实现代码
2018/11/15 Javascript
jQuery 常用特效实例小结【显示与隐藏、淡入淡出、滑动、动画等】
2020/05/19 jQuery
[02:49]2014DOTA2电竞也是体育项目! 势要把荣誉带回中国!
2014/07/20 DOTA
web.py中调用文件夹内模板的方法
2014/08/26 Python
Python使用Scrapy爬虫框架全站爬取图片并保存本地的实现代码
2018/03/04 Python
python pandas dataframe 行列选择,切片操作方法
2018/04/10 Python
详解Python3 对象组合zip()和回退方式*zip
2019/05/15 Python
使用python实现数组、链表、队列、栈的方法
2019/12/20 Python
基于Tensorflow使用CPU而不用GPU问题的解决
2020/02/07 Python
使用CSS3的rem属性制作响应式页面布局的要点解析
2016/05/24 HTML / CSS
css3过渡_动力节点Java学院整理
2017/07/11 HTML / CSS
如何将整数int转换成字串String
2014/03/21 面试题
C#里面可以避免一个类被其他类继承么?如何?
2013/09/26 面试题
环保建议书500字
2014/05/14 职场文书
迎新生晚会主持词
2015/06/30 职场文书
小学四年级作文之写景
2019/08/23 职场文书
教你用Java在个人电脑上实现微信扫码支付
2021/06/13 Java/Android
Python Numpy库的超详细教程
2022/04/06 Python