1

我正在使用 jQuery 循环插件来循环浏览容器中的多个 div。一切运行良好我想添加的唯一功能是，如果容器中只有一张幻灯片，我似乎无法在插件中找到选项，可以隐藏两个按钮。我目前的代码是这样的：

    //Goal summary page cycler
    $('#showGoal').after('<div id="nav">')
                .cycle({
                    fx: 'scrollHorz',
                    speed:300,
                    prev: '#goalPrev',
                    next: '#goalNext',
                    timeout: 0,
                    pager: '#nav',                        
                    after: onAfter, 
                    pagerAnchorBuilder: function(idx, slide) {
                        return'<a href="#"></a>';
                    }
                });

            // call back to remove buttons on first and last slide / adjust height of container
            function onAfter(curr, next, opts, fwd) {
                var index = opts.currSlide;
                $('#goalPrev')[index == 0 ? 'hide' : 'show']();
                $('#goalNext')[index == opts.slideCount - 1 ? 'hide' : 'show']();

                //get the height of the current slide
                var $ht = $(this).height();
                //animates the container's height to that of the current slide 
                $(this).parent().animate({ height: $ht });
            }

我猜我可以检查索引并以这种方式删除它们，或者可能按照 if 语句的行做一些事情，例如（伪代码）：

    var index = this.index();
    var numOfSlides = 0;

    if ( numOfSlide < index ) {
       //hide the buttons 
   }
   else
   {
       //show the buttons
   }

感谢您提供任何可能的帮助！

4

3 回答 3

3

插件作者推荐的方法是使用 Javascript 隐藏按钮：

http://forum.jquery.com/topic/cycle-plugin-hide-prev-next

于 2013-05-30T16:44:07.073 回答
1

它不应该已经工作了吗？如果您只有一张幻灯片，那么您的 onAfter 函数应该会处理它。使用一张幻灯片，您的索引始终为 0。您的 opts.slideCount - 1 也将为零，因为您将有一张幻灯片减一。

编辑：

但如下所述，可能需要在页面加载后调用 onAfter，因为在处理一张幻灯片时，可能不会调用该函数。

于 2012-07-05T22:37:18.340 回答
1

问题解决了，我觉得错过它就像个白痴，您必须首先将箭头的显示设置为无。

于 2012-07-06T18:34:25.120 回答