Javascript 在Twitter引导选项卡中使用多个图像库

我已经创建了3个图像库的基础上，并把他们放在里面

你可以在这里看到

如您所见，库已正确填充并放置在选项卡中；但是，不会显示第二个和第三个库的图像

我猜这可能是因为标签的内容被隐藏了，并且与图库css冲突

你有什么解决办法吗

回答：

根据下面的建议，我最终以这种方式使用它：

$(document).ready(function(){
    $('#slides0').slidesjs({ width: 918, height: 200, navigation: false });
    $("#gallery-tab a").each(function( index ) {
        $(this).on('shown', function(){
            $('#slides' + index).slidesjs({ width: 918, height: 200, navigation: false });
        });
    });
});      

---

大多数选项卡场景最常见的问题是，当选项卡隐藏时，您正在初始化库，因此插件无法计算大小并对不可见的选项卡子元素执行其他操作

您可以1）在tab select上初始化gallery插件，或2）使用类似于

{position:absolute；left:-999em；}

的方法来隐藏选项卡，而不是

{display:none}

更新：根据你的评论，这应该是有效的

$('#gallery-tab a:first[data-toggle="tab"]').on('shown', function () {
   $('#slides0').slidesjs({ width: 918, height: 200, navigation: false });
}) 

---

我尝试了两种解决方案，但仍然无法显示图像。我做了（并分别对每个链接重复）：$（“#gallery tab a:first”）。单击（函数（e）{$（“#slides0”）。slidesjs（{宽度：918，高度：200，导航：false}）；}）通常您会将其作为选项卡插件回调运行，而不是单独的单击函数。谢谢，它成功了。我更新了我的帖子以反映答案。你知道有没有可能实现自动化？例如，如果我添加了另一个库，我不想转到js并添加另一行。当然，您可以使用jQuery查找与选项卡相关的元素。您不需要使用硬编码的ID。在幻灯片实例上放置一个类，并在单击的选项卡中实例化该类。