根据浏览器和分辨率的不同调用相应CSS代码

时间:2011-06-19 01:22:08

根据浏览器和分辨率的不同调用相应CSS代码,这个可能应用不算特别广,但它也非常有实用性。今天小宇收集起来,方便自己和大家以后查阅。

JavaScript Code复制内容到剪贴板
  1. 〈SCRIPT LANGUAGE="javascript"〉    

  2. 〈!--    

  3. if (window.navigator.userAgent.indexOf("MSIE")〉=1)    

  4. {    

  5. var IE1024="";    

  6. var IE800="";    

  7. var IE1152="";    

  8. var IEother="";    

  9. ScreenWidth(IE1024,IE800,IE1152,IEother)    

  10. }else{    

  11. if (window.navigator.userAgent.indexOf("Firefox")〉=1)    

  12. {    

  13. file://如果浏览器为Firefox    

  14. var Firefox1024="";    

  15. var Firefox800="";    

  16. var Firefox1152="";    

  17. var Firefoxother="";    

  18. ScreenWidth(Firefox1024,Firefox800,Firefox1152,Firefoxother)    

  19. }else{    

  20. file://如果浏览器为其他    

  21. var Other1024="";    

  22. var Other800="";    

  23. var Other1152="";    

  24. var Otherother="";    

  25. ScreenWidth(Other1024,Other800,Other1152,Otherother)    

  26. }    

  27. }    

  28. function ScreenWidth(CSS1,CSS2,CSS3,CSS4){    

  29. if ((screen.width == 1024) && (screen.height == 768)){    

  30. setActiveStyleSheet(CSS1);    

  31. }else{    

  32. if ((screen.width == 800) && (screen.height == 600)){    

  33. setActiveStyleSheet(CSS2);    

  34. }else{    

  35. if ((screen.width == 1152) && (screen.height == 864)){    

  36. setActiveStyleSheet(CSS3);    

  37. }else{    

  38. setActiveStyleSheet(CSS4);    

  39. }}}    

  40. }    

  41. function setActiveStyleSheet(title){     

  42. document.getElementsByTagName("link")[0].href="style/"+title;     

  43. }    

  44. file://--〉    

  45. 〈/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文件名.

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

  应E.Qiang提议,编如下代码。实现根据浏览器类型自动调用不同CSS。

  代码:

JavaScript Code复制内容到剪贴板
  1. 〈SCRIPT LANGUAGE="javascript"〉    

  2. 〈!--    

  3. if (window.navigator.userAgent.indexOf("MSIE")〉=1)    

  4. {    

  5. file://如果浏览器为IE    

  6. setActiveStyleSheet("default.css");    

  7. }else{    

  8. if (window.navigator.userAgent.indexOf("Firefox")〉=1)    

  9. {    

  10. file://如果浏览器为Firefox    

  11. setActiveStyleSheet("default2.css");    

  12. }else{    

  13. file://如果浏览器为其他    

  14. setActiveStyleSheet("newsky.css");    

  15. }    

  16. }    

  17. function setActiveStyleSheet(title){     

  18. document.getElementsByTagName("link")[0].href="style/"+title;     

  19. }    

  20. file://--〉    

  21. 〈/SCRIPT〉   

  22.   

解释:如果浏览器为IE,则调用default.css

如果浏览器为Firefox,则调用default2.css

如果浏览器为其他,则调用newsky.css

用法:放在</head>前面即可。
 

本站所有文章均为小宇博客原创,转载请注明来源及出处!

作者:宇天行

本文首发地址:https://www.huceo.com/post/235.html

或许您还会喜欢这些文章:

Tags: 作者:宇天行 | 分类:开发技术 | 评论:13 | 浏览:2282

您对本文《根据浏览器和分辨率的不同调用相应CSS代码》有哪些看法?  ---  【期待您的评论】

您正在以游客身份发表评论:

必填

选填

选填

◎欢迎参与讨论,请在这里发表您的看法、交流您的观点。

南京2011-10-13 22:44:26回复评论
支持一下!

站内文章搜索

转播分享好友

网盟广告赞助