`

 <script type="text/javascript" src="js/jquery.min.js"></script>
    <link rel="stylesheet" href="js/jquery.fancybox-1.3.4/fancybox/jquery.fancybox-1.3.4.css"  type="text/css" media="screen"  />
    <script type="text/javascript" src="js/jquery.fancybox-1.3.4/fancybox/jquery.fancybox-1.3.4.pack.js"></script> 


<script language="javascript">
    $(document).ready(function() {

        /* Apply fancybox to multiple items */



       $("a.grouped_elements").attr('rel', 'gallery').fancybox();
        $("a#inline").fancybox({
            'hideOnContentClick': true
        });

    });

    </script>
<div id="tabs">

    <ul>
        <li><a href="#tab1">Watsons HWB awards</a></li>
        <li><a href="#tab2">Mardi Gras Event</a></li>
        <li><a href="#tab3">WD40 Dealers Summit</a></li>
        <li><a href="#tab4">Chole Fashion Show</a></li>


    </ul>
    <div id="tab1">

    <center>

             <a rel="gallery" class="grouped_elements"  href="images/gallery/gal1.jpg"><img src="images/gallery/gal1.jpg" style="width:100px;height:100px" /></a>
            <a rel="gallery" class="grouped_elements"  href="images/gallery/gal2.jpg"><img src="images/gallery/gal2.jpg" style="width:100px;height:100px" /></a>
             <a rel="gallery" class="grouped_elements"  href="images/gallery/gal3.jpg"><img src="images/gallery/gal3.jpg" style="width:100px;height:100px" /></a>



             <a rel="gallery" class="grouped_elements"  href="images/gallery/gal4.jpg"><img src="images/gallery/gal4.jpg" style="width:100px;height:100px" /></a>
             <a rel="gallery" class="grouped_elements"  href="images/gallery/gal5.jpg"><img src="images/gallery/gal5.jpg" style="width:100px;height:100px" /></a>
             <a rel="gallery" class="grouped_elements"  href="images/gallery/gal6.jpg"><img src="images/gallery/gal6.jpg" style="width:100px;height:100px" /></a>


        </center>


    </div>

`

Ok, so, I have this code right here, Whenever I click on the image in the jquery tab, the fancybox doesn't work. Help please?

What does the developer tools in your browser say? Any error coming up as a clue? Although, on closer inspection, I can see this:

$("a#inline").fancybox({
            'hideOnContentClick': true
        });

but no matching #inline anywhere. Is that correct or an error?

Be a part of the DaniWeb community

We're a friendly, industry-focused community of developers, IT pros, digital marketers, and technology enthusiasts meeting, networking, learning, and sharing knowledge.