Hello and welcome to our community! Is this your first visit?
Register
Enjoy an ad free experience by logging in. Not a member yet? Register.
Results 1 to 5 of 5
  1. #1
    Regular Coder
    Join Date
    Dec 2006
    Posts
    166
    Thanks
    9
    Thanked 4 Times in 4 Posts

    Detect Browser then Display Appropriate CSS

    Well just as the title suggests. Can anybody tell me how I would accomplish this?

  • #2
    Senior Coder
    Join Date
    Nov 2006
    Posts
    1,000
    Thanks
    0
    Thanked 0 Times in 0 Posts
    I don't know the answer but searching the web found

    http://www.brunildo.org/test/csshacks3.html
    http://www.stylegala.com/articles/no_more_css_hacks.htm
    http://www.cssplay.co.uk/menu/conditional.html

    that show some different options.

    david_kw

  • #3
    Senior Coder Len Whistler's Avatar
    Join Date
    Jul 2002
    Location
    Vancouver, BC Canada
    Posts
    1,323
    Thanks
    26
    Thanked 100 Times in 100 Posts
    Quote Originally Posted by 194673 View Post
    Well just as the title suggests. Can anybody tell me how I would accomplish this?
    You could also consider a php script.
    Leonard Whistler

  • #4
    Regular Coder
    Join Date
    Apr 2006
    Posts
    117
    Thanks
    2
    Thanked 0 Times in 0 Posts
    Code:
     
    <!--
     if(navigator.appName == "Microsoft Internet Explorer")
    {
     document.write('<link rel="stylesheet" type="text/css" href="ieStyle.css" />')
    }
    
     else
    {
     document.write('<link rel="stylesheet" type="text/css" href="mainStyle.css" />')
    }
    //-->
    That is how I did it.

    Just put the full App name at the top if statments.


    example:
    Code:
    navigator.appName == Netscape
    You can also add else if statements for more browsers.

    You can also add the code name for Mozilla and Opera.

    example:
    Code:
    navigator.appCodeName == Mozilla
    --For Firefox and Mozilla

    Finally, to be really specific you can even specify browser version

    Example:
    Code:
    navigator.appVersion == 5.0

  • #5
    Master Coder felgall's Avatar
    Join Date
    Sep 2005
    Location
    Sydney, Australia
    Posts
    6,641
    Thanks
    0
    Thanked 649 Times in 639 Posts
    Of course most browsers set the namigator.appName to "Microsoft Internet Explorer" and so you may as well just insert the IE stylesheet if you are going to do it that way. If you really want to apply different styles for IE to correct the page so it appears the same in all browsers then you code your HTML as follows (no Javascript required).

    Code:
    <link rel="stylesheet" type="text/css" href="mainStyle.css" />
    <!--[if IE]>
    <link rel="stylesheet" type="text/css" href="ieStyle.css" />
    <[endif]-->
    Stephen
    Learn Modern JavaScript - http://javascriptexample.net/
    Helping others to solve their computer problem at http://www.felgall.com/

    Don't forget to start your JavaScript code with "use strict"; which makes it easier to find errors in your code.


  •  

    Posting Permissions

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