zoukankan      html  css  js  c++  java
  • 动态更换CSS文件案例分辨率不同,调用不同的css文件方法

    根据分辨率不同,调用不同的css文件方法不同浏览器调用不同CSS文件

    将以下JS代码放入<head>和</head>标签内,此段JS代码作用是辨别浏览器分辨率

    1. <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){
         file:
      //如果浏览器为Firefox
         var Firefox1024="";
         
      var Firefox800="";
         
      var Firefox1152="";
         
      var Firefoxother="";
         ScreenWidth(Firefox1024,Firefox800,Firefox1152,Firefoxother)
         }
      else{
         file:
      //如果浏览器为其他
         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;
        }
        file:
      //-->
        </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。

    调用不同CSS文件JS代码:

    <SCRIPT LANGUAGE="javascript">
    <!--
    if (window.navigator.userAgent.indexOf("MSIE")>=1)
    {
    file:
    //如果浏览器为IE
    setActiveStyleSheet("default.css");
    }
    else{
    if (window.navigator.userAgent.indexOf("Firefox")>=1)
    {
    file:
    //如果浏览器为Firefox
    setActiveStyleSheet("default2.css");
    }
    else{
    file:
    //如果浏览器为其他
    setActiveStyleSheet("newsky.css");
    }
    }
    function setActiveStyleSheet(title){
    document.getElementsByTagName(
    "link")[0].href="style/"+title;
    }
    file:
    //-->
    </SCRIPT>


    解释:

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

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

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

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

    作者:BuildNewApp
    出处:http://syxchina.cnblogs.comBuildNewApp.com
    本文版权归作者、博客园和百度空间共有,欢迎转载,但未经作者同意必须保留此段声明,且在文章页面明显位置给出原文连接,否则作者会诅咒你的。
    如果您阅读了我的文章并觉得有价值请点击此处,谢谢您的肯定1。
  • 相关阅读:
    确定查询各阶段消耗的时间
    mysql 处理查询请求过程
    如何获取有性能问题的SQL
    索引优化策略
    CXF支持 SOAP1.1 SOAP1.2协议
    MYSQL 基于GTID的复制
    poj2056
    poj2049
    poj1033
    poj1221
  • 原文地址:https://www.cnblogs.com/syxchina/p/2197330.html
Copyright © 2011-2022 走看看