title: fancybox inline content with gallery
body: <p>I'm using Fancybox to display inline content, an imagine and an iframe.
  THis is the site:http://marturii-nunta.com.ro/index.php.
  I want to create a gallery, so that the user can navigate through images, but I don't know how to apply it on inline content...
  Please advise</p>
  
  <p>Here's my code:</p>
  
  <pre><code>&lt;div style="display:none"&gt;
      &lt;a id="inline" href="#popup"&gt;open&lt;/a&gt;
      &lt;div id="popup"&gt;
          &lt;table&gt;
              &lt;tr&gt;
                  &lt;td&gt;&lt;img class="bigpic" src="" width="550px" height="500"/&gt;&lt;div id="caption"&gt;&lt;/div&gt;&lt;td&gt;
  
                  &lt;td&gt;&lt;iframe width="390" height="490" frameborder="0" scrolling="no" src="form.php"&gt;&lt;/iframe&gt;&lt;/td&gt;
              &lt;/tr&gt;
          &lt;/table&gt;
  
      &lt;/div&gt;
  &lt;/div&gt;
  </code></pre>
  
  <p>The JS:</p>
  
  <pre><code>&lt;script&gt;
  var code = ""; // product code
  var caption = "";
  $(document).ready(function() {
  
  /* Using custom settings */
  $("a#inline").fancybox({
  
    'scrolling'    : 'no',
    'onComplete'     : function() {
      $('#popup iframe').contents().find('#code').val(code);
       $('#popup iframe').contents().find('#caption').val(caption);
  
    },
    'titleShow'    : false
  });
  
  $(".trigger").click(function() {
    $('#popup img.bigpic').attr('src',$(this).data('href') || $(this).attr('src'));
  
    $('#popup iframe').attr("src", "form.php"); // on next call this was not set
    code = $(this).data('code');
    caption = $(this).data('caption');
    $('#inline').trigger('click');
  });
  
  });
  &lt;/script&gt;
  </code></pre>
  
  <p>HTML:</p>
  
  <pre><code>&lt;div class='content_item' id='item_div' style=' width:222px;height:210px' &gt;
              &lt;img src='imagini/".$code.".jpg' id='".$code."' alt='cocarde'  style='width:218px;height:163px' class='trigger' data-caption='".$description[$code]."' data-code='".$code."' data-href='imagini/".$code.".jpg'&gt;&lt;br&gt;
              &lt;div style='padding-top:5px'&gt;&lt;span class='cod'&gt;".$cod_produs."&lt;/span&gt;&lt;span class='cod_pret'&gt;".$code."&lt;/span&gt;&lt;/div&gt;
              &lt;span class='pricestyle'&gt;&lt;strong&gt;".$pret." ".$price." ".$currency."&lt;/span&gt;&lt;/strong&gt;
              &lt;div&gt;
  </code></pre>
  
  <p>Thanks!</p>