引导轮播 - 幻灯片项目的外部链接

Question

我需要在一个轮播中提供直接链接幻灯片。我试图实现this solution，但没有成功。我需要一些 URL，例如：www.domain.com/index.html#slide20" 来直接打开项目幻灯片。

我有一个包含 59 个项目的轮播，并且希望能够在其中任何一个中打开...从外部网页... 有没有可能的javascript配置？

应该使用任何这个 id 标签吗？

<div class="item" id="51" data-id="51" data-slide="51">
   ...
</div>

Answer 1

#slide20 会自动滚动到 ID 为 slide20 的元素（如果存在）。给你的轮播一个 ID 或类，然后使用下面的代码滑动到某个数字。为此，您必须确保第 20 张幻灯片是第 20 张幻灯片，具体取决于实现。

如果轮播中有 59 个元素，请确保 #slide20 打开第 20 张幻灯片。

在本例中，您的轮播的 ID 为 myCarousel。

$(document).ready(function() {
    $("#myCarousel").carousel(window.location.hash.substr(6) - 1);
});

此代码未经测试，但它所做的是检索#slide 后面的值。 window.location.hash 返回#slide20，但您只对20 感兴趣。您想要第 7 个（以及更多）字符，并且从索引 0 开始，这样就剩下 substr(6)。从该数字中减去 1，因为 slide1 应该是第一张幻灯片，但 Bootstrap 也从索引 0 开始计数。

我还没有测试过代码，但它应该可以工作，看 Bootstrap 的代码。