JS点击放大

Question

现在这个效果，点击弹出大图后，里面有左右切换。
但是如果我从新建立div调用1次后显示的是所有的张数。 我想分开可以吗？ 就是一个DIV里面显示这个DIV里面的图片切换，不需要显示所有的图片数。<div>
     <a rel="group" href="images/b1.jpg" title="图片标题"><img alt="" src="images/s1.gif" /></a>
     <a rel="group" href="images/b2.jpg" title="图片标题"><img alt="" src="images/s2.gif" /></a>
     <a rel="group" href="images/b3.jpg" title="蓝天白云绿草"><img alt="" src="images/s3.gif" /></a>
     </div>
      <div>
     <a rel="group" href="images/b11.jpg" title="图片标题"><img alt="" src="images/s11.gif" /></a>
     <a rel="group" href="images/b22.jpg" title="图片标题"><img alt="" src="images/s22.gif" /></a>
     <a rel="group" href="images/b33.jpg" title="蓝天白云绿草"><img alt="" src="images/s33.gif" /></a>
     </div>
$(function(){
$("#demo1").fancybox({
    'transitionIn' : 'elastic',
'transitionOut' : 'elastic',
'titlePosition' : 'inside'
});
$("a[rel=group]").fancybox({
'titlePosition' : 'over',
'cyclic'        : true,
'titleFormat' : function(title, currentArray, currentIndex, currentOpts) {
return '<span id="fancybox-title-over">' + (currentIndex + 1) + ' / ' + currentArray.length + (title.length ? ' &nbsp; ' + title : '') + '</span>';
}
});
$("#showdiv").fancybox({'centerOnScroll':true});
$("#ajax").fancybox({'width':400});
$("#iframe").fancybox({
'width':'75%',
'height':'75%',
'autoScale':false
});
$("#swf").fancybox({
'autoScale':false
});
$("#modal").fancybox({
'modal':false,
'overlayShow':true,
'hideOnOverlayClick':false,
'hideOnContentClick':false,
'enableEscapeButton':false,
'showCloseButton':false,
'centerOnScroll':true,
'autoScale':false,
'width':540,
'height':360
});
});

Answer 1

效果是这样的，不过他的这个再次调用一次，大图切换就会计算所有的图片！
比如我再次复制：
<p>
     <a rel="group" href="images/b1.jpg" title="图片标题"><img alt="" src="images/s1.gif" /></a>
     <a rel="group" href="images/b2.jpg" title="图片标题"><img alt="" src="images/s2.gif" /></a>
     <a rel="group" href="images/b3.jpg" title="蓝天白云绿草"><img alt="" src="images/s3.gif" /></a>
     </p>
就会是6张切换了！！ 我是想在新的<p>里面按照新的<p>里面的图片切换。不按照全部来计算！http://www.helloweba.com/demo/fancybox/