title: Overlay not working fancybox v2
body: <p>I'd like to change the overlay and opacity of a fancy box in the code below. I tried to add these lines based on JFK's suggestions but unfortunately it is not working:</p>
  
  <pre><code>   &lt;script type="text/javascript"&gt;
  $(".fancybox").fancybox({
      helpers : {
          overlay : {
              css : {
                  'background' : 'rgba(58, 42, 45, 0.3)'
              }
          }
      }
  });
  
  &lt;/script&gt;
  </code></pre>
  
  <p>just after the opening script tag but without success. Any thoughts? Thanks</p>
  
  <p>My full code now:</p>
  
  <pre><code>    &lt;script type="text/javascript"&gt;
  $(".fancybox").fancybox({
      helpers : {
          overlay : {
              css : {
                  'background' : 'rgba(58, 42, 45, 0.3)'
              }
          }
      }
  });
  
  function openFancybox() {
      setTimeout( function() {$('#various1').trigger('click'); },2000);
  
  }
  $(document).ready(function() {
      var visited = $.cookie('visited');
      if (visited == 'yes') {
          return false;
      } else {
          openFancybox();
      }
      $.cookie('visited', 'yes', { expires: 1 });
      $('#various1').fancybox();
  
  });
  &lt;/script&gt;
  </code></pre>
  
  <p>Within body tags:</p>
  
  <pre><code>&lt;div id="various1" style="display:none;"&gt;
  &lt;h2&gt;Welcome to our website!&lt;/h2&gt;
  &lt;/div&gt;
  </code></pre>