集成bootstrap图库模板以使用fancybox显示每个缩略图？

Question

我想让fancybox与bootstrap模板一起工作，但我不知道如何正确地整合这两者。这怎么可能？我正在使用this引导程序模板和this版本的fancybox。

这是我的代码段：

<div class="container">

    <div class="row">

    <!--  Fancybox code-- WORKING  -->
    <a class="fancybox-thumb" rel="group" href="400x300.gif" title="Westfield Waterfalls - Middletown CT Lower (Graham_CS)"><img src="400x300.gif" alt="" /></a><br> 


    <!-- Attempt to combine fancybox and template -- NOT WORKING -->
    <div class="col-lg-3 col-md-4 col-xs-6 thumb">
        <a class="thumbnail fancybox-thumb" href="http://placehold.it/400x300" title="HELLO">
            <img class="img-responsive" src="http://placehold.it/400x300">
        </a>
    </div>

    <!-- bootstrap template example -- WORKING -->
    <div class="col-lg-3 col-md-4 col-xs-6 thumb">
        <a class="thumbnail" href="#">
            <img class="img-responsive" src="http://placehold.it/400x300">
        </a>
    </div>
    </div>
</div>

我有一个工作的fancybox和一个工作的bootstrap模板，但我尝试将两者合并失败了。我以为我可以把这两个课程结合起来让它们一起工作？

谢谢！