根据判断浏览器类型屏幕分辨率自动调用不同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 相关文章推荐
图片img的src不变让浏览器重新加载实现方法
Mar 29 Javascript
Javascript 中创建自定义对象的方法汇总
Dec 04 Javascript
JS正则表达式学习之贪婪和非贪婪模式实例总结
Dec 26 Javascript
javascript过滤数组重复元素的实现方法
May 03 Javascript
Vue应用部署到服务器的正确方式
Jul 15 Javascript
jQuery实现的两种简单弹窗效果示例
Apr 18 jQuery
javascript 使用sleep函数的常见方法详解
Apr 26 Javascript
VSCode搭建Vue项目的方法
Apr 30 Javascript
解决Echarts2竖直datazoom滑动后显示数据不全的问题
Jul 20 Javascript
javascript读取本地文件和目录方法详解
Aug 06 Javascript
WebPack工具运行原理及入门教程
Dec 02 Javascript
原生JavaScript实现购物车
Jan 10 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
Snoopy类使用小例子
2008/04/15 PHP
浅析SVN常见问题及解决方法
2013/06/21 PHP
PHP获取文件夹内文件数的方法
2015/03/12 PHP
详解PHP的Laravel框架中Eloquent对象关系映射使用
2016/02/26 PHP
thinkphp ajaxfileupload实现异步上传图片的示例
2017/08/28 PHP
PHP pthreads v3使用中的一些坑和注意点分析
2020/02/21 PHP
在视频前插入广告
2006/11/20 Javascript
javascript的trim,ltrim,rtrim自定义函数
2008/09/21 Javascript
JQuery 常用操作代码
2010/03/14 Javascript
JS保留小数点(四舍五入、四舍六入)实现思路及实例
2013/04/25 Javascript
js onload事件不起作用示例分析
2013/10/09 Javascript
让新消息在网页标题闪烁提示的jQuery代码
2013/11/04 Javascript
node.js中的fs.lstat方法使用说明
2014/12/16 Javascript
jQuery Easyui学习之datagrid 动态添加、移除editor
2016/01/27 Javascript
通过Tabs方法基于easyUI+bootstrap制作工作站
2016/03/28 Javascript
JS中位置与大小的获取方法
2016/11/22 Javascript
使用javascript做在线算法编程
2018/05/25 Javascript
jQuery插件Validation表单验证详解
2018/05/26 jQuery
解决ant design vue中树形控件defaultExpandAll设置无效的问题
2020/10/26 Javascript
基于element-ui封装表单金额输入框的方法示例
2021/01/06 Javascript
Vue ​v-model相关知识总结
2021/01/28 Vue.js
[34:47]完美世界DOTA2联赛PWL S2 Magma vs LBZS 第一场 11.18
2020/11/18 DOTA
python提取页面内url列表的方法
2015/05/25 Python
python3.0 模拟用户登录,三次错误锁定的实例
2017/11/02 Python
python实现在函数中修改变量值的方法
2019/07/16 Python
python Django中models进行模糊查询的示例
2019/07/18 Python
在Pytorch中计算卷积方法的区别详解(conv2d的区别)
2020/01/03 Python
python实现猜数游戏
2020/03/27 Python
使用Python对Dicom文件进行读取与写入的实现
2020/04/20 Python
使用keras和tensorflow保存为可部署的pb格式
2020/05/25 Python
Python reversed反转序列并生成可迭代对象
2020/10/22 Python
在阿尔卑斯山或希腊度过快乐假期:Alpine Elements
2019/12/28 全球购物
.NET面试题:什么是反射
2016/09/30 面试题
经销商年会策划方案
2014/05/29 职场文书
2014年档案管理员工作总结
2014/12/01 职场文书
JavaScript异步操作中串行和并行
2021/11/20 Javascript