Results 1 to 6 of 6

Thread: target safari for css

  1. #1
    Join Date
    Jan 2008
    Posts
    441
    Thanks
    67
    Thanked 4 Times in 4 Posts

    Default target safari for css

    i just found this script to target safari

    Code:
    <script type="javascript">
    isSafari3 = false;
    if(window.devicePixelRatio) isSafari3 = true;
    </script>
    but where would i add the "safari.css" line to point to a different css file?

  2. #2
    Join Date
    May 2007
    Location
    Boston,ma
    Posts
    2,127
    Thanks
    173
    Thanked 207 Times in 205 Posts

    Default

    You could also do this using the user agent and serverside script. If you'd want to do it with a server side solution let me know.
    Corrections to my coding/thoughts welcome.

  3. #3
    Join Date
    Jan 2008
    Posts
    441
    Thanks
    67
    Thanked 4 Times in 4 Posts

    Default

    i guess i wasnt clear, i have a file called safari.css
    where do i write that in the JS above?

    yes i would like to hear more about a server sided solution

  4. #4
    Join Date
    May 2007
    Location
    Boston,ma
    Posts
    2,127
    Thanks
    173
    Thanked 207 Times in 205 Posts

    Default

    Server Side version. I forget where I got this but I didn't right it, I made some modifications but don't think they're present here.

    PHP Code:
    <head>
    <?php
    function browser_info($agent=null) {
      
    // Declare known browsers to look for
      
    $known = array('msie''firefox''safari''webkit''opera''netscape',
        
    'konqueror''gecko');
      
    // Clean up agent and build regex that matches phrases for known browsers
      // (e.g. "Firefox/2.0" or "MSIE 6.0" (This only matches the major and minor
      // version numbers.  E.g. "2.0.0.6" is parsed as simply "2.0"
      
    $agent strtolower($agent $agent $_SERVER['HTTP_USER_AGENT']);
      
    $pattern '#(?<browser>' join('|'$known) .
        
    ')[/ ]+(?<version>[0-9]+(?:\.[0-9]+)?)#';
      
    // Find all phrases (or return empty array if none found)
      
    if (!preg_match_all($pattern$agent$matches)) return array();
      
    // Since some UAs have more than one phrase (e.g Firefox has a Gecko phrase,
      // Opera 7,8 have a MSIE phrase), use the last one found (the right-most one
      // in the UA).  That's usually the most correct.
      
    $i count($matches['browser'])-1;
      return array(
    $matches['browser'][$i] => $matches['version'][$i]);
    }
    $ua browser_info();
    if (
    $ua['firefox']) { 
        echo 
    '<link rel="stylesheet" type="text/css" href="firefox.css" />';
    }
    if (
    $ua['msie']) { 
        echo 
    '<link rel="stylesheet" type="text/css" href="ie.css" />';
    }
    if (
    $ua['opera']) { 
        echo 
    '<link rel="stylesheet" type="text/css" href="opera.css" />';
    }
    if (
    $ua['safari']) { 
        echo 
    '<link rel="stylesheet" type="text/css" href="safari.css" />';
    }
    ?>
    </head>
    EDIT: Eit you can also target specific versions for example

    Code:
    if ($ua['safari'] < 3)
    For more examples see here: http://php.net/manual/en/function.get-browser.php I found where I got that.
    Last edited by bluewalrus; 09-29-2010 at 10:57 PM.
    Corrections to my coding/thoughts welcome.

  5. The Following User Says Thank You to bluewalrus For This Useful Post:

    Fighterfox (11-30-2010)

  6. #5
    Join Date
    Jan 2008
    Posts
    441
    Thanks
    67
    Thanked 4 Times in 4 Posts

    Default

    thank you! can this also detect if it is mac firefox vs pc firefox?

  7. #6
    Join Date
    May 2007
    Location
    Boston,ma
    Posts
    2,127
    Thanks
    173
    Thanked 207 Times in 205 Posts

    Default

    It will now hah

    PHP Code:
    <head>
    <?php
    function browser_info($agent=null) {
        global 
    $os;
        
    // Declare known browsers to look for
        
    $known = array('msie''firefox''safari''webkit''opera''netscape''konqueror''gecko');
        
    // Clean up agent and build regex that matches phrases for known browsers
        // (e.g. "Firefox/2.0" or "MSIE 6.0" (This only matches the major and minor
        // version numbers.  E.g. "2.0.0.6" is parsed as simply "2.0"
        
    $agent strtolower($agent $agent $_SERVER['HTTP_USER_AGENT']);
        if (
    preg_match('/linux/'$agent)) { 
            
    $os "Linux";
        }elseif (
    preg_match('/macintosh|mac os x/'$agent)) {
            
    $os 'Mac';
        } elseif (
    preg_match('/windows|win32/'$agent)) {
            
    $os 'Windows';
        } else {
            
    $os 'Unknown';
            
    //Set this to the operating system you'd expect because if they get here it was unrecognizible
        

        
    $pattern '#(?<browser>' join('|'$known) . ')[/ ]+(?<version>[0-9]+(?:\.[0-9]+)?)#';
        
    // Find all phrases (or return empty array if none found)
        
    if (!preg_match_all($pattern$agent$matches)) return array();
            
    // Since some UAs have more than one phrase (e.g Firefox has a Gecko phrase,
            // Opera 7,8 have a MSIE phrase), use the last one found (the right-most one
            // in the UA).  That's usually the most correct.
        
    $i count($matches['browser'])-1;
        return array(
    $matches['browser'][$i] => $matches['version'][$i]);
    }
    $ua browser_info();
    if (
    $os == 'Mac') {
        if (
    $ua['firefox']) { 
            echo 
    '<link rel="stylesheet" type="text/css" href="mac_firefox.css" />';
        }
    //    if ($ua['msie']) { 
    //        echo $ua['msie'];
    //    } MAC NO LONGER HAS AN IE IF YOU WANT TO TEST FOR IE YOU COULD...
        
    if ($ua['opera']) { 
        echo 
    '<link rel="stylesheet" type="text/css" href="mac_opera.css" />';
        }
        if (
    $ua['safari']) { 
        echo 
    '<link rel="stylesheet" type="text/css" href="mac_safari.css" />';
        }
    } elseif (
    $os == 'Windows') {
        if (
    $ua['firefox']) {
            echo 
    '<link rel="stylesheet" type="text/css" href="windows_firefox.css" />';
        }
        if (
    $ua['msie']) { 
            echo 
    '<link rel="stylesheet" type="text/css" href="windows_ie.css" />';
        }
        if (
    $ua['opera']) { 
                echo 
    '<link rel="stylesheet" type="text/css" href="windows_opera.css" />';
        }
        if (
    $ua['safari']) { 
                echo 
    '<link rel="stylesheet" type="text/css" href="windows_safari.css" />';
        }
    } elseif (
    $os == 'Unknown') {
                    echo 
    '<link rel="stylesheet" type="text/css" href="default.css" />';
    }
    ?>
    </head>
    Oh, yea I didn't do the conditionals for Linux but you get the just of it?
    Corrections to my coding/thoughts welcome.

Bookmarks

Posting Permissions

  • You may not post new threads
  • You may not post replies
  • You may not post attachments
  • You may not edit your posts
  •