代码如下:

<!--
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;
}
//-->

解释:

var IE1024="";

var IE800="";

var IE1152="";

var IEother="";

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

varFirefox1024="";

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。 

代码如下:<SCRIPTLANGUAGE="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]

前面即可。

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

代码如下:

<scriptlanguage=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>

JS判断浏览器类型和屏幕分辨率来调用不同的CSS样式的更多相关文章

  1. js判断浏览器类型 js判断ie6不执行

    js判断浏览器类型 $.browser  对象 $.browser.version 浏览器版本 var binfo = ''; if ($.browser.msie) { binfo = " ...

  2. Js 判断浏览器类型整理

    判断原理 JavaScript是前端开发的主要语言,我们可以通过 编写JavaScript程序来判断浏览器的类型及版本.JavaScript判断浏览器类型一般有两种办法,一种是根据各种浏览器独有的属性 ...

  3. JS判断浏览器类型,JS判断客户端操作系统

    JS判断浏览器类型 function judge(){ var browser = { versions: function() { var u = navigator.userAgent, app ...

  4. JS判断浏览器类型和详细区分IE各版本浏览器

    今天用到JS判断浏览器类型,于是就系统整理了一下,便于后期使用. ? 1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 ...

  5. JS判断浏览器类型的方法总结(IE firefox chrome opera safari)

    JS判断浏览器类型的方法总结,可判别当前客户端所使用的浏览器是ie,firefox,safari,chrome或者是opera,另外js可以精确判断到ie浏览器的版本,依然直接上代码,需要的朋友可按照 ...

  6. js判断浏览器类型以及浏览器版本

    判断浏览器类型:   if navigator.userAgent.indexOf(”MSIE”)>0) {} //判断是否IE浏览器 if(isFirefox=navigator.userAg ...

  7. JS判断浏览器类型及版本

    浏览器 ie firefox opera safari chrome 分类: 一路辛酸---JavaScript 你知道世界上有多少种浏览器吗?除了我们熟知的IE, Firefox, Opera, S ...

  8. js判断浏览器类型以及版本

    你知道世界上有多少种浏览器吗?除了我们熟知的IE, Firefox, Opera, Safari四大浏览器之外,世界上还有近百种浏览器. 几天前,浏览器家族有刚诞生了一位小王子,就是Google推出的 ...

  9. 【javascript】—— JS判断浏览器类型、操作系统

    navigator.userAgent : userAgent 属性是一个只读的字符串,声明了浏览器用于 HTTP 请求的用户代理头的值. navigator.platform : platform ...

随机推荐

  1. PL/SQL编程基础

    1. PL/SQL块的基础结构 DECLARE /* * 定义部分——定义常量.变量.复杂数据类型.游标.用户自定义异常 */ BEGIN /* * 执行部分——PL/SQL语句和SQL语句 */ E ...

  2. STM32:TIMER输出比较模式-PWM

    在自己小板子上移植PWM时候又重新学习了一下,加入两点:1,对各种输出比较模式的学习:2,输出模式时加入中断 先写出函数: //TIM4 PWM部分初始化 //PWM输出初始化 //period:输出 ...

  3. Java中static方法

    今天学习到了并且应用到了java中的静态方法,并且了解到它的好处与缺点. ● 生命周期(Lifecycle): 静态方法(Static Method)与静态成员变量一样,属于类本身,在类装载的时候被装 ...

  4. HDU 5279 分治NTT 图的计数

    思路: 显然每个子图内都是森林 去掉所有子图1和n都连通且每条大边都存在的情况 直接DP上 NTT优化一波 注意前两项的值.. //By SiriusRen #include <bits/std ...

  5. [转]linux之awk命令

    转自:http://blog.chinaunix.net/uid-23302288-id-3785105.html awk是行处理器: 相比较屏幕处理的优点,在处理庞大文件时不会出现内存溢出或是处理缓 ...

  6. Log4J2的 PatternLayout

    Log4J2 PatternLayout 参考 日志样例 : 2018-10-21 07:30:05,184 INFO - DeviceChannelServiceImpl.java:434[defa ...

  7. React Native真机调试安卓版

    React Native真机调试安卓版 一.准备工作 1.1 环境搭建 React Native中文网的文档已经非常清晰地描述了,按照步骤即可.http://reactnative.cn/docs/0 ...

  8. Java类加载机制总结

    关于Java类加载机制的几个基本概念: JDK提供的基本类加载器:引导类加载器(Bootstrap Class Loader)-用于加载JDK中的核心类.扩展类加载器(Ext Class Loader ...

  9. html5——文本阴影

    基本结构 text-shadow: 30px 23px 31px #;/* 文字阴影: 水平位移 垂直位移 模糊程度 阴影颜色*/ 凹凸文字 <!DOCTYPE html> <htm ...

  10. html5——DOM扩展

    元素获取 1.document.getElementsByClassName ('class') 通过类名获取元素,以类数组形式存在. 2.document.querySelector(‘div’) ...