title: Fancybox 2 arrows not showing up
body: <p>I'm using fancyBox 2 to display groups of iframe content. I'm able to navigate through the content using the arrows on my keyboard and by clicking on either the right or left side of the content, but I'm unable to get the arrows to display. I've even set the arrows to be visible all the time instead of just on hover and still no luck. I'm going to have clickable content in some of the iframes so I need to be able to turn off the ability to click just anywhere in the content for navigation. Also that option interferes with the scroll bar.</p>
  
  <p>Here is my code</p>
  
  <pre><code>&lt;!-- Add jQuery library --&gt;
  &lt;script type="text/javascript" src="http://code.jquery.com/jquery-latest.min.js"&gt;&lt;/script&gt;
  
  &lt;!-- Add fancyBox --&gt;
  &lt;link rel="stylesheet" href="../../../scripts/fancybox/source/jquery.fancybox.css?v=2.1.4" type="text/css" media="screen" /&gt;
  &lt;script type="text/javascript" src="../../../scripts/fancybox/source/jquery.fancybox.pack.js?v=2.1.4"&gt;&lt;/script&gt;
  
  &lt;link rel="stylesheet" href="../../../scripts/fancybox/source/helpers/jquery.fancybox-thumbs.css?v=1.0.7" type="text/css" media="screen" /&gt;
  &lt;script type="text/javascript" src="../../../scripts/fancybox/source/helpers/jquery.fancybox-thumbs.js?v=1.0.7"&gt;&lt;/script&gt;
  
  &lt;script type="text/javascript"&gt;
      $(document).ready(function() {
      $(".fancybox").fancybox({
          fitToView   : false,
          autoSize    : false,
          closeClick  : false,
          openEffect  : 'none',
          closeEffect : 'none',
          showArrows  : true,
          arrows      : true,
          type        : 'iframe',
      });
  });
  &lt;/script&gt;
  </code></pre>
  
  <p>And the HTML</p>
  
  <pre><code>&lt;a class="fancybox" rel="andyAdams" href="andyadams/one.html"&gt;&lt;img src="thumbnailImages/adams1.jpg" height="150" width="150" alt="Andy Adams" /&gt;&lt;/a&gt;
  
  &lt;a class="fancybox" rel="andyAdams" href="andyadams/two.html"&gt;&lt;img src="thumbnailImages/adams2.jpg" height="150" width="150" alt="Andy Adams" /&gt;&lt;/a&gt;
  
  &lt;a class="fancybox" rel="andyAdams" href="andyadams/three.html"&gt;&lt;img src="thumbnailImages/adams3.png" height="150" width="150" alt="Andy Adams" /&gt;&lt;/a&gt;
  
  &lt;a class="fancybox" rel="andyAdams" href="andyadams/four.html"&gt;&lt;img src="thumbnailImages/adams4.jpg" height="150" width="150" alt="Andy Adams" /&gt;&lt;/a&gt;
  </code></pre>
  
  <p>Any help is appreciated! Thank you!</p>