使用增量/减量的 jQuery 图像滑块答案

【问题标题】：jQuery image slider using an increment/decrement使用增量/减量的 jQuery 图像滑块
【发布时间】：2016-02-08 15:10:46
【问题描述】：

我正在尝试创建一个滑块，该滑块使用增量/减量来移动，然后根据行中图像的最大数量隐藏或显示按钮。它在一个 div 中使用一个 div，隐藏的溢出应该移动，直到达到最大图像数量，这是箭头应该被隐藏的时候，这样人就不能继续进入溢出创建的空白区域。但是，隐藏/显示不起作用，该人可以继续增加，因为即使在达到最大图像数量后箭头仍然可见。

如何让左右箭头在击中相应数字时隐藏？

编辑：我知道 .css 搞砸了，我只想让箭头先隐藏/显示，谢谢

var pressCounter = 0;
    var maxImgCounter = $('.carousel-image').length; // gain the max amount of images
    var maxSlide = maxImgCounter - 4;// - the amount of images visible on the screen so it does notshow white space

    if ( pressCounter < maxSlide){
        $('#right').show();
    }else{
        $('#right').hide();
    }
    if (pressCounter > 0){
        $('#left').show();
    }else{
        $('#left').hide();
    }

    /* Left arrow */
    $('#left').click(function(){
        $( '.slide' ).css({
            "position": "relative",
            "right": -280 * pressCounter
        });
        pressCounter--;
        return pressCounter; 
    });
    /* Right arrow */
     $('#right').click(function(){
         $( '.slide' ).css({
            "position": "relative",
            "right": 280 * pressCounter
         }); 
         pressCounter++;
         return pressCounter;
         });

【问题讨论】：

您需要将校验码放在一个函数中并在初始和每次更改计数器时调用它。
另请注意：从 click 事件返回 pressCounter 不会做任何有用的事情（除了在您点击 0 时禁用任何点击）
@GoneCodingGoodbye 谢谢！对不起语言：/

标签： javascript jquery slider counter increment

【解决方案1】：

   if ( pressCounter < maxSlide){
        $('#right').show();
    }else{
        $('#right').hide();
    }
    if (pressCounter > 0){
        $('#left').show();
    }else{
        $('#left').hide();
    }

考虑当值小于 maxslide 并且 presscounter 大于零时会发生什么。几乎，这个条件总是如你所写的那样为真，所以两个 if 语句每次都被触发 - 一个接一个。结果是您的左右箭头将始终显示 - 允许用户继续点击最后一张幻灯片。

【讨论】：