Question

您好我一直在尝试为Twitter Bootstrap实现Jason Butz的Lightbox插件（我正在使用Bootstrap的第3版）。

到目前为止，我在将灯箱从缩略图图像触发到较大的图像方面取得了有限的成功。

这是其他人的例子：

这是我的不在的地方（以下小提琴中的所有js和css与灯箱文件相同）：

...和我的代码：

<div class="container">
    <div class="item">
        <a data-toggle="lightbox" href="#lightbox0">
            <img class="gallery" src='https://farm8.staticflickr.com/7275/7535360724_02f36c5af4_n.jpg'>
        </a>
    </div>
</div>

<div id="#lightbox0" class="lightbox hide fade" tabindex="-1" role="dialog" aria-hidden="true">
    <div class="lightbox-dialog">
        <div class="lightbox-header">
            <button type="button" class="close" data-dismiss="lightbox" aria-hidden="true">&times;</button>
        </div>
    <div class="lightbox-content">
        <img src='https://farm8.staticflickr.com/7275/7535360724_02f36c5af4_b.jpg'>
        <div class="lightbox-caption"><p>Your caption here</p></div>
    </div>
</div>

我一直在将我的代码与示例进行比较，我无法弄清楚问题是什么。

Answer 1

下面显示的小问题

 <div id="lightbox0" class="lightbox fade" tabindex="-1" role="dialog" aria-hidden="true">
//Removed hide class and corrected the selector id.
 <div id="#lightbox0" class="lightbox hide fade" tabindex="-1" role="dialog" aria-hidden="true">

Fiddle

Bootstrap灯箱不工作

1 个答案: