javascript - 无法在div中联系第n个子img

我有这个小提琴，我想只显示默认的第一张照片，然后隐藏其余的照片，并通过每次鼠标滚动来更改照片。 var i由mousescroll确定，如果i 5，我希望操作中断，因为没有第n个大于5或小于1的孩子。

请在您的答案中提供小提琴。谢谢。

http://jsfiddle.net/a8FGe/6/

$(window).scroll(function(event){
   var i = 0;
   var st = $(this).scrollTop();
   if (st > 0)
   {
       var i += 1;
       if (i > 5)
       {
           return;
       }
       $("img").hide();
       $("img:nth-child(" + i + ")").show();
   }
    else
   {
       var i -= 1;
       if (i < 0)
       {
           return;
       }
       $("img").hide();
       $("img:nth-child(" + i + ")").show();
   }
});

最佳答案

您是否正在寻找这样的东西？

http://jsfiddle.net/a8FGe/7/

var i = 1;
$(document).bind('mousewheel', function (e) {

    if (e.originalEvent.wheelDelta < 0) { // scroll down
        if (i + 1 <= 5)
            i++;
        else
            return;

    } else {
        if (i - 1 >= 1)
            i--;
        else
            return;

    }
    //console.log(i);
    $("img").hide();
    $("img:nth-child(" + i + ")").show();
});

关于javascript - 无法在div中联系第n个子img，我们在Stack Overflow上找到一个类似的问题：https://stackoverflow.com/questions/19346233/