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 9 of 9
  1. #1
    New Coder
    Join Date
    Aug 2008
    Location
    Boston, MA
    Posts
    24
    Thanks
    9
    Thanked 0 Times in 0 Posts

    Detecting the Apple Safari browser

    Here is what I am currently using for a script:


    Code:
    <script>
    function detectBrowser()
    {
    var browser=navigator.appName;
    var navindex=navigator.userAgent.indexOf('Safari');
    
    if (navindex != -1 || browser=='Safari') {alert("The Apple Safari browser does not calculate correctly.)"} 
    </script>
    --------------------------------------------------
    and for this to work when the page loads, I use:

    Code:
    <body onload="detectBrowser()";>
    Basically, I have received E-Mails from people stating that my website calculators are off by a factor of 100 for anyone using the Apple Safari browser.
    Since, my website calculates correctly in Internet Explorer, Netscape, Mozilla Firefox, Opera and Google Chrome, I feel this is an Apple Safari problem.
    Anyway, the above code seems to work okay, but it generates the pop-up when people are using Google Chrome.
    Is there any way that the script can be changed so that it only pops up when loading Apple Safari?
    Thanks.
    Last edited by wolf1728; 03-24-2009 at 07:09 PM. Reason: added "code" tags

  • #2
    jkd
    jkd is offline
    Senior Coder jkd's Avatar
    Join Date
    May 2002
    Location
    metro DC
    Posts
    3,163
    Thanks
    1
    Thanked 18 Times in 18 Posts
    Why don't you post the code in question and we can help fix the actual problem? Rendering engines can be incredibly inconsistent, but Javascript (read: not DOM) tends to be fairly consistent across browsers (with a few esoteric exceptions, of course), so it is somewhat surprising that some calculation is off by exactly 100.

  • Users who have thanked jkd for this post:

    wolf1728 (03-24-2009)

  • #3
    New Coder
    Join Date
    Aug 2008
    Location
    Boston, MA
    Posts
    24
    Thanks
    9
    Thanked 0 Times in 0 Posts
    Hi jkd,

    Okay if you want to get right to the actual calculations, here is one of several dozen calculators that do not work with Apple Safari.
    http://www.1728.com/flowrate.htm
    Yes, I do use a rounding routine in most of those calculators which might be responsible, but why is it that at least five browsers can do the calcuations error free but Safari is causing problems?
    I could post the code but it is several pages long, unless you just want the rounding routine?

  • #4
    Supreme Master coder! abduraooft's Avatar
    Join Date
    Mar 2007
    Location
    N/A
    Posts
    14,863
    Thanks
    160
    Thanked 2,224 Times in 2,211 Posts
    It's always a good practice to rectify all errors in markup, before doing any javascript operations, see http://validator.w3.org/check?uri=ht...Inline&group=0

    A valid markup needs a valid DOCTYPE at the top.
    The Dream is not what you see in sleep; Dream is the thing which doesn't let you sleep. --(Dr. APJ. Abdul Kalam)

  • #5
    New Coder
    Join Date
    Aug 2008
    Location
    Boston, MA
    Posts
    24
    Thanks
    9
    Thanked 0 Times in 0 Posts
    Okay, returning to my original question, how do I detect an Apple Safari Browser?
    Here is a webpage I just wrote
    http://www.1728.com/browser_detect.htm
    and this passes the HTML 4.0 Validator test 100%.

    How would I write this so that it will only generate a "popup" when it is loaded by an Apple Safari browser?
    Here is the entire code:
    Code:
       <!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
    <html>
    <head>
    <meta name="generator" content="HTML Tidy for Linux (vers 6 November 2007), see www.w3.org">
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8">
    <title>Browser Detector</title>
    <script language="JavaScript" type="text/javascript">
    function detectBrowser()
    {
    var nav=navigator.userAgent;
    var navindex=navigator.userAgent.indexOf('Safari');
    var browser=navigator.appName;
    var b_version=navigator.appVersion;
    var version=parseFloat(b_version);
      {alert('NAVIGATOR.USER.AGENT=      '+nav);
    alert('NAVIGATOR.USER.AGENT.INDEXOF= '+navindex);
      alert('NAVIGATOR.APPNAME= '+ browser);
      alert('VERSION= '+version);
      }
    
    <!-- if (navindex != -1 ) {alert("Apple Safari browser")}
    } 
    </script>
    <style type="text/css">
     body {
      background-color: #CCCCCC;
     }
     div.c2 {color: #000099; text-align: center}
     span.c1 {font-family: Arial; font-size: 120%}
    </style>
    </head>
    <body onload="detectBrowser()">
    <div class="c2"><span class="c1">This detects the type of browser you are using.</span></div>
    </body>
    </html>
    The code will go in the section I "commented out" but what are the parameters that will ensure an alert "popup" will occur only when the user is using an Apple Safari browser?

  • #6
    Supreme Master coder! Philip M's Avatar
    Join Date
    Jun 2002
    Location
    London, England
    Posts
    18,144
    Thanks
    203
    Thanked 2,547 Times in 2,525 Posts
    There is a book

    "Professional JavaScript for Web developers" by Nicholas C. Zakas

    which explains how to detect Apple Safari browser. It is not simple!

  • #7
    Kor
    Kor is offline
    Red Devil Mod Kor's Avatar
    Join Date
    Apr 2003
    Location
    Bucharest, ROMANIA
    Posts
    8,478
    Thanks
    58
    Thanked 379 Times in 375 Posts
    There is no 100% accurate javascript method to detect all the browser types and/or the OS. Most of the time browsers do "spoof" the Agent or Appname...

    The only 100% safe method is on using some JScript specific codes (JScript is IE variant of javascript) to detect IE and IE versions:
    Code:
    var isIE = /*@cc_on!@*/false; //IE detector
    In fact most of the time the developer does not need to detect the browser. He may need to detect if a javascript method is understood or not by the interpreter, and this is an accurate detector.
    KOR
    Offshore programming
    -*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*

  • #8
    New Coder
    Join Date
    Aug 2008
    Location
    Boston, MA
    Posts
    24
    Thanks
    9
    Thanked 0 Times in 0 Posts
    PhilipM and Kor - thanks for those suggestions.
    Currently, the coding I am using is
    Code:
    if(navigator.userAgent.indexOf('Safari')=="101"){alert("Apple Safari")}
    which seems to detect only Apple Safari, but I am sure there must be better ways than that.

    Kor, since you mentioned about testing if a Javascript method is understood by the interpreter, how is that done specifically?

  • #9
    Kor
    Kor is offline
    Red Devil Mod Kor's Avatar
    Join Date
    Apr 2003
    Location
    Bucharest, ROMANIA
    Posts
    8,478
    Thanks
    58
    Thanked 379 Times in 375 Posts
    Quote Originally Posted by wolf1728 View Post
    Kor, since you mentioned about testing if a Javascript method is understood by the interpreter, how is that done specifically?
    Most of the time, if a browser do not follow a standard method, it has his own similar method (or a workaround is possible). Here's an example of capturing the mouse position, on using separate methods for IE (and compliant) browsers and Mozilla (and complaint browsers)
    Code:
    <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"  "http://www.w3.org/TR/html4/loose.dtd">
    <html>
    <head>
    <title>Untitled Document</title>
    <meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
    <meta http-equiv="Content-Style-Type" content="text/css">
    <meta http-equiv="Content-Script-Type" content="text/javascript">
    <script type="text/javascript">
    var posx;var posy;
    function getMouse(e){
    posx=0;posy=0;
    var e=(!e)?window.event:e;//IE:Moz
    if (e.pageX){//Moz
    posx=e.pageX+window.pageXOffset;
    posy=e.pageY+window.pageYOffset;
    }
    else if(e.clientX){//IE
    if(document.documentElement){//IE 6+ strict mode
    posx=e.clientX+document.documentElement.scrollLeft;
    posy=e.clientY+document.documentElement.scrollTop;
    }
    else if(document.body){//Other IE
    posx=e.clientX+document.body.scrollLeft;
    posy=e.clientY+document.body.scrollTop;
    }
    }
    else{return false}//old browsers
    document.getElementById('myspan').firstChild.data='X='+posx+' Y='+posy;
    }
    document.onmousemove=getMouse
    </script>
    </head>
    <body>
    <span id="myspan">&nbsp;</span>
    </body>
    </html>
    All the modern browsers do follow the standards (ECMAScript and W3C DOM) more or less. There are still some different models or bugs in some special cases. It is hard to do a list of those; there are not so many, but they are quite important (capturing event models, attaching event models, and other seveal ones...). Almost all the differences revolve round the differences between IE and Mozilla. Still there are reported some few bugs or incomplete implementation of standard methods in case of other browsers (Opera, Chrome, Safari).

    Another discussion could be about the inconsistency of the IE versions. There are cases for which IE8, IE7 and IE6 act in different ways.
    Last edited by Kor; 03-26-2009 at 12:25 PM.
    KOR
    Offshore programming
    -*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*


  •  

    Posting Permissions

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