Question

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

感谢您的支持

Answer 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');
}

然后在转换回调中调用该函数：

$('#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;

Answer 2

如果您在代码中使用nowrap选项进行幻灯片放映。请尝试以下方法：

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

希望这有帮助

富

如何禁用jQuery循环插件中最后一张幻灯片上的“开始”和“下一步”按钮上的“上一步”按钮？

2 个答案: