Manual trigger of multiple Fancybox on same page

Question

I am having some issues when I tried to trigger multiple FancyBox gallery on "click" event. The first gallery is showing fine. But the second gallery opens up the image but with no navigation is shown. I have searched here but couldnot find any.

My code goes below:

HTML

<div class="hidd_div">
        <a rel="example_group" href="gallery_images/umbd1.jpg"><img alt="" class="gall_1" src="gallery_images/umbd1.jpg" /></a>
        <a rel="example_group" href="gallery_images/umbd2.jpg" title=""><img alt="" class="gall_1" src="gallery_images/umbd2.jpg" /></a>
        <a rel="example_group" href="gallery_images/umbd3.jpg" title=""><img alt="" class="gall_1" src="gallery_images/umbd3.jpg" /></a>
        <a rel="example_group" href="gallery_images/umbd4.jpg" title=""><img class="gall_1" alt="" src="gallery_images/umbd4.jpg" /></a>
        <a rel="example_group" href="gallery_images/umbd5.jpg" title=""><img class="gall_1" alt="" src="gallery_images/umbd5.jpg" /></a>
        <a rel="example_group" href="gallery_images/umbd6.jpg" title=""><img class="gall_1" alt="" src="gallery_images/umbd6.jpg" /></a>
        <a rel="example_group" href="gallery_images/umbd7.jpg" title=""><img class="gall_1" alt="" src="gallery_images/umbd7.jpg" /></a>
        <a rel="example_group" href="gallery_images/umbd9.jpg" title=""><img class="gall_1" alt="" src="gallery_images/umbd9.jpg" /></a>
        <a rel="example_group" href="gallery_images/umbd10.jpg" title=""><img class="gall_1" alt="" src="gallery_images/umbd10.jpg" /></a>
    </div>
    <br />
    <h3>Photo Gallery</h3>
    <div class="button_sty" id="gallery1">Environment and Ecological assessment of Kalyan Sagar,Udaipur</div>
    <br />
    <div class="hidd_div">
        <a class="group2" href="gallery_images/rd2.jpg"><img alt="" class="gall_1" src="gallery_images/rd2.jpg" /></a>
        <a class="group2" href="gallery_images/rd3.jpg" title=""><img alt="" class="gall_1" src="gallery_images/rd3.jpg" /></a>
        <a class="group2" href="gallery_images/rd4.jpg" title=""><img alt="" class="gall_1" src="gallery_images/rd4.jpg" /></a>
        <a class="group2" href="gallery_images/rd5.jpg" title=""><img class="gall_1" alt="" src="gallery_images/rd5.jpg" /></a>
        <a class="group2" href="gallery_images/rd6.jpg" title=""><img class="gall_1" alt="" src="gallery_images/rd6.jpg" /></a>
        <a class="group2" href="gallery_images/rd8.jpg" title=""><img class="gall_1" alt="" src="gallery_images/rd8.jpg" /></a>
        <a class="group2" href="gallery_images/rd9.jpg" title=""><img class="gall_1" alt="" src="gallery_images/rd9.jpg" /></a>
        <a class="group2" href="gallery_images/rd10.gif" title=""><img class="gall_1" alt="" src="gallery_images/rd10.gif" /></a>
        <a class="group2" href="gallery_images/rd11.gif" title=""><img class="gall_1" alt="" src="gallery_images/rd11.gif" /></a>
    </div>
    <br />
    <div class="button_sty" id="gallery2">Pollution Status Assessment of Rana Deghi</div>

JS Codes

$(document).ready(function(){
        $("a[rel=example_group]").fancybox({type:'image'});
        $("#gallery1").click(function(){
         $("a[rel=example_group]").eq(0).trigger("click");
        }); 
        $("a[class=group2]").fancybox({type:'image'});
        $("#gallery2").click(function(){
         $("a[class=group2]").eq(0).trigger("click");
        });
    });