图片库项目计数？

Question

我正在尝试使用存储在 json 对象中的数据创建一个简单的图片库。它工作得很好，除了我似乎无法在关闭图像后成功 'reset' 图像计数，而且每次我打开图像时顺序都是错误的。我知道这与模数有关，但我不知道我哪里出错了。

$.getJSON('js/work.json', function(data){

  var current = 0;
  var projects = data.projects;
  var currArr;

  $('.work-row > div').on('click', function(){

    current = 0;

    var i = $(this).index('.work-row div');
    currArr = projects[i];

    preloadImages(currArr, function(){


      $('.pop-forward').click(function(){
        current ++;
        current = current % currArr.images.length;
        $('.pop').css('backgroundImage', 'url(../images/work/main/'+currArr.dir+'/'+currArr.images[current].src+'.jpg)');
      });


      $('.pop-back').click(function(){
        current--;
        current = (current < 0) ? currArr.images.length-1 : current;
        $('.pop').css('backgroundImage', 'url(../images/work/main/'+currArr.dir+'/'+currArr.images[current].src+'.jpg)');
      });


      $('.close-image').click(function(){
        current = 0;
      });

    });

  });

这里是 json:

{
  "projects": [
      {
          "dir" : "project1",
          "copy" : "Lorem Ipsum",
          "images" : [
          { 
           "src": "image1"
          },
          { 
           "src": "image2"
          },
          { 
           "src": "image3"
        }
      ]
    }
 ]
}

任何帮助将不胜感激！！

Answer 1

current = current % currArr.images.length;

应该是

current = current >= currArr.images.length ? 0 : current;

这应该可以解决排序问题。

将全局 current 变量放在第一个函数之前。

图片库项目计数？

Image gallery item counting?

javascript

jquery

json

count

gallery