1

我目前正在使用 jQuery Superslides 并希望将分页移到包装器 div 之外。现在分页位于我的图像之上,我想将分页移到下面。我试过 insertAfer 容器,它可以工作,但它会抛出分页幻灯片顺序。

有没有人遇到过这个问题?我假设必须调整 superslide.js 文件...

任何建议,或者是否有人遇到问题并有一个很棒的解决方案!

默认输出:

<div id="slides" style="position: relative; overflow: hidden; width: 100%; height: 594px;">
 <div class="slides-control" style="position: relative; height: 100%; width: 4995px; left: -1665px;">
 <nav class="slides-pagination">
  <a class="current" href="#1">1</a>
  <a href="#2">2</a>
  <a href="#3">3</a>
 </nav>
</div>
</div>

4

1 回答 1

1

您应该像这样自己输出自定义分页 HTML:

<nav class="slides-pagination">
    <a class="current" href="#1">1</a>
    <a href="#2">2</a>
    <a href="#3">3</a>
</nav>

然后禁用自动分页功能:

$('#slides').superslides({
    pagination: false
});

而且由于它们.current仅将类附加到自动生成的菜单,因此您需要使用如下animated.slides事件复制此功能:

$('#slides').superslides({
    pagination: false
}).on('animated.slides', function() { 
    var current_index = $(this).superslides('current');
    $('.slides-pagination a').removeClass('current');
    $('.slides-pagination a').eq(current_index).addClass('current');
});
于 2014-06-26T16:40:12.460 回答