title: OnClick not working in chrome
body: <p>I searched a lot for an answer, but I didn't understand how to fix this... </p>
  
  <p>So I have a landing page and I want to add an arrow thats point where it download the file (in chrome its button left).</p>
  
  <p>For the arrow i used this code: <a href="http://jsfiddle.net/hY2Ce/4/" rel="nofollow">http://jsfiddle.net/hY2Ce/4/</a></p>
  
  <p>The problem is that its works great in safari but on chrome it doesn't show the arrow...</p>
  
  <p>My code: <a href="http://jsfiddle.net/zP5Km/" rel="nofollow">http://jsfiddle.net/zP5Km/</a></p>
  
  <blockquote>
    <p>If you need more code just tell me...</p>
  </blockquote>
  
  <p>Thanks a lot!</p>
  
  <p><strong>Javascript</strong></p>
  
  <pre><code>navigator.sayswho= (function(){
      var N= navigator.appName, ua= navigator.userAgent, tem;
      var M= ua.match(/(opera|chrome|safari|firefox|msie)\/?\s*(\.?\d+(\.\d+)*)/i);
      if(M &amp;&amp; (tem= ua.match(/version\/([\.\d]+)/i))!= null) M[2]= tem[1];
      M= M? [M[1], M[2]]: [N, navigator.appVersion,'-?'];
      return M;
  })();
  // http://stackoverflow.com/questions/2400935/browser-detection-in-javascript#2401861
  //console.log(navigator.sayswho);
  
  function auK(auy) {
      $(auy).fadeIn(750, function () {
          setTimeout(function () {
              $(auy).fadeOut(1000);
          }, 10000);
      });
  }
  
  function download() {
      if (navigator.sayswho[0].toLowerCase() == 'chrome') {
        auK('#arrow-chrome');
  
      }
      if ((navigator.sayswho[0].toLowerCase() == 'msie') &amp;&amp; (navigator.sayswho[1] == 9.0)) {
        auK('#arrow-ie');
  
      }
      if (navigator.sayswho[0].toLowerCase() == 'safari' &amp;&amp; (navigator.platform.toUpperCase().indexOf('MAC')&gt;=0) ) {
        auK('#arrow-safari-mac');
  
      }
  }
  </code></pre>
  
  <p><strong>HTML</strong></p>
  
  <pre><code>&lt;a href="http://www.example.com/test.exe" class="top-download-button" onclick="download()" &gt;
    &lt;img class="a" src="img/download-button.png" alt="Download"&gt;
    &lt;img class="b" src="img/download-button-hover.png" alt="Download" &gt;
  &lt;/a&gt;
  
  &lt;div id="arrow-chrome"&gt;&lt;/div&gt;
  &lt;div id="arrow-ie"&gt;&lt;/div&gt;
  &lt;div id="arrow-safari-mac"&gt;&lt;/div&gt;
  </code></pre>
  
  <p><strong>CSS</strong></p>
  
  <pre><code>#arrow-chrome, #arrow-ie, #arrow-safari-mac {
      position: fixed;
      display: none;
      z-index: 10;
      height: 309px;
      width: 186px;
  }
  
  #arrow-chrome {
      bottom: 10px;
      left: 20px;
      background: url("http://cdn.mediafire.com/images/backgrounds/download/dlpointers/arrow_down.png") no-repeat scroll center center transparent;
  }
  
  #arrow-ie {
      bottom: 10px;
      left: 50%;
      margin-left: -140px;
      background: url("http://cdn.mediafire.com/images/backgrounds/download/dlpointers/arrow_down.png") no-repeat scroll center center transparent;
  }
  
  #arrow-safari-mac {
      top: 10px;
      right: 10px;
      z-index: 100 !important;
      background: url("http://cdn.mediafire.com/images/backgrounds/download/dlpointers/arrow_up.png") no-repeat scroll center center transparent;
  }
  
  html,body {
      width:100%;
      height:100%;
  }
  </code></pre>