2017-01-16 92 views
0

我只是写了一个简单的脚本来改变点击背景,问题是当电路板的第一个元素在这里省略第二次重复我的代码更改在单击背景,并跳过第一个元素板

$(function() { 
    var i = 0; 
    var preloadImg = [ 
     'https://www.colourbox.com/preview/11903964-black-and-white-embossed-paper-background-lighting-effect.jpg', 
     'http://download.4-designer.com/files/20140222/Personalized-lobes-mosaic-background-vector-material-57935.jpg', 
     'http://www.tabletwallpapers.org/download/peak-wallpaper_800x800.png', 
     'https://s29.postimg.org/51x27g4dj/save_world_colo2r.jpg' 
    ]; 

    $(".right").click(function() { 
     if (i < preloadImg.length) { 
      $('.back').css('background-image', 'url(' + preloadImg[i] + ')'); 
     } else if (i == preloadImg.length) { 
      i = 0;   
     } 
     i++; 
    }); 
}); 

这里的:Demo

+0

你正在设置'i = 0;',然后你再次用i ++增加i;' – CBroe

回答

0

或许你可以试试这个:

$(".right").click(function(){    
     if(i==preloadImg.length){ 
     i = 0; 
     } 
     $('.back').css('background-image', 'url(' + preloadImg[i] + ')'); 
     i++; 
}); 

这里是fiddle

+0

谢谢Jerred求助,它解决了我的问题100% –

0

在这里你去

$(function() { 

    var i = 0; 
    var preloadImg = ['http://www.tabletwallpapers.org/download/peak-wallpaper_800x800.png','https://www.colourbox.com/preview/11903964-black-and-white-embossed-paper-background-lighting-effect.jpg','http://download.4-designer.com/files/20140222/Personalized-lobes-mosaic-background-vector-material-57935.jpg','https://s29.postimg.org/51x27g4dj/save_world_colo2r.jpg']; 

    $(".right").click(function() { 

    if(i<preloadImg.length) { 
     $('.back').css('background-image', 'url(' + preloadImg[i] + ')'); 
     i++; 
     if(i==preloadImg.length) { 
     i = 0; 
     } 
    } 
    }); 
}); 
0

不知道我完全理解你在说什么,但如果它是你缺少的情况下第一图像的完整循环后,也有一些方法来解决这个问题,最简单的就是设置你的图像中的其他部分...

https://jsfiddle.net/ux5a8e0o/12/

if (i < preloadImg.length) { 
     $('.back').css('background-image', 'url(' + preloadImg[i] + ')'); 

    } else if (i == preloadImg.length) { 
     i = 0; 
     $('.back').css('background-image', 'url(' + preloadImg[i] + ')'); 
    } 
    i++; 

然而,有更优雅的方式。 ..