Fancybox 1.3.4 - 如何在单个图库中使用多个内联元素？

Question

通常您使用Fancybox来显示由多个图像组成的图库，您可以在其中从一个图像翻转到下一个图像（使用箭头或键盘）。

问题：
我想对inline HTML元素执行相同的操作，以便Fancybox打开图库，显示第一个内联元素，如果单击箭头，它将显示第二个内联元素等。

你是怎么做到的？是否可以使用Fancybox？

以下是我的代码适用于单个HTML内联元素：

<script>
  $(document).ready(function() {
    $('a#inlinetest').fancybox({
        'type':'inline',
        'overlayShow': true,
        'overlayOpacity': 0.7,
        'overlayColor': '#666',
        'titleShow': false
    });
  });
</script>
<div>
  <a id="inlinetest"  href="#inlinedata">Click here</a>
  <div style="display:none;">
    <div id="inlinedata">
      <div>TEST</div>
    </div>
  </div>
</div>

这是带有两个INLINE元素的代码，但不起作用：

<script>
  $(document).ready(function() {
    $('a#inlinetest').fancybox({
        'type':'inline',
        'overlayShow': true,
        'overlayOpacity': 0.7,
        'overlayColor': '#666',
        'titleShow': false
    });
  });
</script>
<div>
  <a id="inlinetest"  href="#inlinedata">Click here</a>
  <div style="display:none;">
    <div id="inlinedata">
      <div>HTML Content of element 1 comes here</div>
    </div>
    <div id="inlinedata">
      <div>HTML Content of element 2 comes here</div>
    </div>
  </div>
</div>