这是一个创建于 2010 天前的主题，其中的信息可能已经有所发展或是发生改变。
下面是我找的 JS 轮播图插件，点左箭头滑动到第一张缩略图时，后面是空白的，如何让它循环起来呢，应该如何解决？前端新手，请指教，感激不尽
以下是代码：
var thumbNum=$("#ProductThumbs .Product_Thumbs").length;
var thumbActive=$("#ProductThumbs .active-thumb").parent("li").index();
$("#ProductThumbs").css('width', thumbNum * 90 + 'px');
$("#ProductThumbs").css('left', '-' + thumbActive * 0 + 'px');
$('body').on('click', '#prev_btn2', function () {
if(thumbActive<thumbnum-1){ $("#productthumbs").css('left',="" '0px');="" (thumbactive="" if="" thumbactive="0;" thumbactive++;="" }="" }else{=""> 4) {
$("#ProductThumbs").css('left', '-' + (thumbActive - 4) * 90 + 'px');
}
$("#ProductThumbs .Product_Thumbs").eq(thumbActive).find(".product-single__thumb").click();
});
$('body').on('click', '#prev_btn1', function () {
if(thumbActive>0){
thumbActive--;
}else{
thumbActive=thumbNum-1;
}
if (thumbActive === 0) {
$("#ProductThumbs").css('left', '0px');
} else {
$("#ProductThumbs").css('left', '-' + thumbActive * 90 + 'px');
}
$("#ProductThumbs .Product_Thumbs").eq(thumbActive).find(".product-single__thumb").click();
});
});</thumbnum-1){>6 条回复 • 2019-05-26 15:43:06 +08:00
 |
1
moonshow OP 自顶，刚学完 html+css 开始学 js 感觉好难呀，大家有什么推荐的视频课程？
|
 |
2
phxsuns 2019-05-26 15:18:38 +08:00
感觉这个插件的交互设计的有点问题。
如果是最后几张的话，不应该整体向前移动的。 |
 |
4
lzxgh621 2019-05-26 15:33:34 +08:00 via Android
无限循环体验不好
看看别的样式的 demo 吧 |
|
5
lzxgh621 2019-05-26 15:34:58 +08:00 via Android  1
还有 你那确定不是最后一张图而是第一张？
|
|
6
moonshow OP @lzxgh621 感谢回复，右侧箭头是正常的，<img src="https://s2.ax1x.com/2019/05/26/VEgxnU.gif">
应该是最后一张图， 你可以打开网址看下 https://www.coolestsale.com/collections/wireless-charger/products/captain-america-superman-wireless-charger |
Select Language