根据判断浏览器类型屏幕分辨率自动调用不同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 相关文章推荐
解析arp病毒背后利用的Javascript技术附解密方法
Aug 06 Javascript
js 鼠标点击事件及其它捕获
Jun 04 Javascript
cloudgamer出品ImageZoom 图片放大效果
Apr 01 Javascript
js验证IP及子网掩码的合法性有效性示例
Apr 30 Javascript
jQuery实现自动滚动到页面顶端的方法
May 22 Javascript
Javascript控制div属性动态变化实例分析
Oct 08 Javascript
Node.js中防止错误导致的进程阻塞的方法
Aug 11 Javascript
canvas绘制万花筒效果(代码分享)
Jan 20 Javascript
vue init失败简单解决方法(终极版)
Dec 22 Javascript
JavaScript惰性载入函数实例分析
Mar 27 Javascript
vue实现Excel文件的上传与下载功能的两种方式
Jun 28 Javascript
vue 路由守卫(导航守卫)及其具体使用
Feb 25 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
处理单名多值表单的详解
2013/06/08 PHP
php file_get_contents抓取Gzip网页乱码的三种解决方法
2013/11/12 PHP
用PHP解决的一个栈的面试题
2014/07/02 PHP
php保存任意网络图片到服务器的方法
2015/04/14 PHP
初识ThinkPHP控制器
2016/04/07 PHP
PHP实现生成推广海报的方法详解
2018/03/14 PHP
PHP PDOStatement::fetchAll讲解
2019/01/31 PHP
JQUERY 对象与DOM对象之两者相互间的转换
2009/04/27 Javascript
ASP.NET jQuery 实例6 (实现CheckBoxList成员全选或全取消)
2012/01/13 Javascript
jquery动画4.升级版遮罩效果的图片走廊--带自动运行效果
2012/08/24 Javascript
javascript数组去重3种方法的性能测试与比较
2013/03/26 Javascript
JavaScript之IE的fireEvent方法详细解析
2013/11/20 Javascript
倒记时60刷新网页的js代码
2014/02/18 Javascript
js实现汉字排序的方法
2015/07/23 Javascript
java必学必会之static关键字
2015/12/03 Javascript
jQuery实现点击表格单元格就可以编辑内容的方法【测试可用】
2016/08/01 Javascript
BootStrap Typeahead自动补全插件实例代码
2016/08/10 Javascript
jQuery Easyui快速入门教程
2016/08/21 Javascript
NodeJS设计模式总结【单例模式,适配器模式,装饰模式,观察者模式】
2017/09/06 NodeJs
详解利用Angular实现多团队模块化SPA开发框架
2017/11/27 Javascript
angularjs中判断ng-repeat是否迭代完的实例
2018/09/12 Javascript
JS实现的自定义map方法示例
2019/05/17 Javascript
解决 window.onload 被覆盖的问题方法
2020/01/14 Javascript
js常用方法、检查是否有特殊字符串、倒序截取字符串操作完整示例
2020/01/26 Javascript
[01:33]PWL开团时刻DAY2-开雾与反开雾
2020/10/31 DOTA
Python中列表的一些基本操作知识汇总
2015/05/20 Python
Python随机生成带特殊字符的密码
2016/03/02 Python
python hook监听事件详解
2018/10/25 Python
Django web框架使用url path name详解
2019/04/29 Python
Python编程中类与类的关系详解
2019/08/08 Python
全球最大的房车租赁市场:Outdoorsy
2018/09/19 全球购物
公务员的自我鉴定
2013/10/26 职场文书
初中生学习生活的自我评价
2013/11/20 职场文书
环境工程专业个人求职信
2013/12/05 职场文书
影子教师研修方案
2014/06/14 职场文书
焦裕禄精神心得体会
2014/09/02 职场文书