如何在 jQuery 循环插件中禁用开始时的上一个按钮和最后一张幻灯片上的下一个按钮？答案

【问题标题】：How can I disable Previous button on start and Next button on the last slide in jQuery cycle plug in?如何在 jQuery 循环插件中禁用开始时的上一个按钮和最后一张幻灯片上的下一个按钮？
【发布时间】：2012-02-01 06:59:43
【问题描述】：

我想使用 jQuery 循环插件在我的网页中显示一些幻灯片。我想连续展示 4 张幻灯片。当用户单击 Next 按钮时，slides 只移动一张幻灯片（在这种情况下，只有第一张幻灯片隐藏和过去的三张幻灯片，并且将显示新幻灯片）。所以我想禁用开始时的上一个按钮和最后一张幻灯片上的下一个按钮。必须禁用自动滑动选项并隐藏寻呼机。只有下一个和上一个按钮可以移动。如何为这个功能设置 jQuery 循环插件？

感谢您的支持

【问题讨论】：

标签： jquery cycle jquery-cycle

【解决方案1】：

看看这个！你需要这个功能：

function onAfter(curr, next, opts) {
    var Left = $(opts.prev); // Fetches selector from .cycle options (ex. #prev)
    var Right = $(opts.next); // Fetches selector from .cycle options (ex. #next)
    var index = opts.currSlide;
    index == 0 ? Left.css('visibility','hidden') : Left.css('visibility','visible');
    index == opts.slideCount - 1 ? Right.css('visibility','hidden') : Right.css('visibility','visible');
}

然后再调用transition回调中的函数：

$('#slideWrapper').cycle({ 
    fx      : 'scrollHorz', 
    speed   : 400, 
    timeout : 0, 
    next    : '#next', 
    prev    : '#prev',
    after   : onAfter, // <-- right here
    nowrap  : true
});

只是为了清楚。上述函数使用三元组。例如：

if(x == 1) {
    Foo = 1
} else {
    Foo = 2
}

和下面的一样

x==1 ? Foo = 1 : Foo = 2;

【讨论】：

【解决方案2】：

如果您在幻灯片放映的代码中使用 nowrap 选项。请尝试以下操作：

<script type="text/javascript">
$(document).ready(function() {
   $("#slides").cycle({
    fx:    'shuffle',
    speed:    400,
    timeout:    0,
    next:   '#next2', 
    prev:   '#prev2',
    nowrap: 1
  });
});
</script>

希望对你有帮助

丰富

【讨论】：