根据判断浏览器类型屏幕分辨率自动调用不同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判断两种格式的输入日期的正确性的代码
Mar 25 Javascript
各情景下元素宽高的获取实现代码
Sep 13 Javascript
JS中typeof与instanceof之间的区别总结
Nov 14 Javascript
javascript和jQuery实现网页实时聊天的ajax长轮询
Jul 20 Javascript
深入探讨Vue.js组件和组件通信
Sep 12 Javascript
Knockout结合Bootstrap创建动态UI实现产品列表管理
Sep 14 Javascript
js实现省份下拉菜单效果
Feb 15 Javascript
jquery实现数字输入框
Feb 22 Javascript
微信小程序实现简单input正则表达式验证功能示例
Nov 30 Javascript
VUE前后端学习tab写法实例
Aug 06 Javascript
浅析vue-cli3配置webpack-bundle-analyzer插件【推荐】
Oct 23 Javascript
基于Web Audio API实现音频可视化效果
Jun 12 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
用PHP的ob_start();控制您的浏览器cache!
2006/11/25 PHP
php 执行系统命令的方法
2009/07/07 PHP
php使用json_decode后数字对象转换成了科学计数法的解决方法
2017/02/20 PHP
PHP去除字符串最后一个字符的三种方法实例
2017/03/01 PHP
PHP实现SMTP邮件的发送实例
2018/09/27 PHP
js用Date对象处理时间实现思路及代码
2013/01/31 Javascript
Javascript级联下拉菜单以及AJAX数据验证核心代码
2013/05/10 Javascript
jquery获得option的值和对option进行操作
2013/12/13 Javascript
Jquery 在页面加载后执行的几种方式
2014/03/14 Javascript
javascript操作excel生成报表全攻略
2014/05/04 Javascript
详解JavaScript基本类型和引用类型
2015/12/09 Javascript
Bootstrap项目实战之子栏目资讯内容
2016/04/25 Javascript
基于javascript实现最简单的选项卡切换效果
2016/05/16 Javascript
详解angularjs中的隔离作用域理解以及绑定策略
2017/05/31 Javascript
Angular排序实例详解
2017/06/28 Javascript
angularjs实现猜数字大小功能
2020/05/20 Javascript
微信小程序block的使用教程
2018/04/01 Javascript
微信小程序 scroll-view的使用案例代码详解
2020/06/11 Javascript
vuex刷新后数据丢失的解决方法
2020/10/18 Javascript
python分割文件的常用方法
2014/11/01 Python
Python的string模块中的Template类字符串模板用法
2016/06/27 Python
全面了解Nginx, WSGI, Flask之间的关系
2018/01/09 Python
Python装饰器用法示例小结
2018/02/11 Python
tensorflow实现逻辑回归模型
2018/09/08 Python
python 求一个列表中所有元素的乘积实例
2019/06/11 Python
Python爬虫:Request Payload和Form Data的简单区别说明
2020/04/30 Python
Python astype(np.float)函数使用方法解析
2020/06/08 Python
python 爬虫网页登陆的简单实现
2020/11/30 Python
喜诗官方在线巧克力店:See’s Candies
2017/01/01 全球购物
世界汽车零件:World Car Parts
2019/09/04 全球购物
我能否用void** 指针作为参数, 使函数按引用接受一般指针
2013/02/16 面试题
2014村书记党建工作汇报材料
2014/11/02 职场文书
2019广播稿怎么写
2019/04/17 职场文书
vue使用节流函数的踩坑实例指南
2021/05/20 Vue.js
flex弹性布局详解
2022/03/20 HTML / CSS
「玫瑰之王的葬礼」舞台剧主视觉图公开
2022/03/21 日漫