0

我创建了一个菜单，用于浏览特定页面上的幻灯片列表。

它的 HTML 代码如下：-

 <ul class="dropdown">
      <li class="orange"><a href="#" data-jumpslide="2"><div class="list-item one-liner"><div class="left"><span id="functionality-icon"></span></div> <div class="right">When to do it</div><div class="clear"></div></div></a></li>
      <li class="orange"><a href="#" data-jumpslide="3" ><div class="list-item one-liner"><div class="left"><span id="functionality-icon"></span></div> <div class="right">Key faces</div><div class="clear"></div></div></a></li>
      <li class="orange"><a href="#" data-jumpslide="5" ><div class="list-item one-liner"><div class="left"><span id="functionality-icon"></span></div> <div class="right">Functionalities</div><div class="clear"></div></div></a></li>
 </ul>

请注意标签的“自定义属性”，它告诉我要浏览到哪张幻灯片。

这个 JS 代码允许我这样做：-

$('a[data-jumpslide]').each(function(idx, ele){
    $(ele).on('click', function(){
        var slideToJump = $(this).data('jumpslide');
        window.slider.go(false, slideToJump+1);
    });
});

如您所见，它获取页面上幻灯片的编号并跳到上面。

幻灯片都在同一页面上，所以基本上这段代码移动幻灯片在同一页面上，并带我去任何我想去的幻灯片。我的问题是现在我一直在尝试将幻灯片移到另一页上。

因此，如果我单击链接以移动到具有特定幻灯片编号的不同页面，我将如何做到这一点？

谢谢。

4

1 回答 1

1

您需要将该幻灯片值作为井号标签传递到下一页。

这些页面应包含一个检查该 hastag 值的脚本：

window.location.hash;

然后只需将该哈希值传递给幻灯片选择器函数。

要获取 href 和主题标签，您只需修改当前拥有的内容：

$('a[data-jumpslide]').each(function(idx, ele){
    $(ele).on('click', function(e){
        e.preventDefault();
        var href = $(this).attr('href');
        var slideToJump = $(this).data('jumpslide');
        slideToJump++;
        window.location(href+'#'+slideToJump);
    });
});

然后你的目标 href 应该有这样的东西来捕获主题标签：

<script>
$(document).ready(function(){
    var hash = window.location.hash;
    window.slider.go(false, hash);
});
</script>
于 2013-04-25T20:50:37.570 回答