我构建的滑块正在工作.当您单击下一步时,滑块将在左侧动画.
诀窍
在初始化时,我在最后一张幻灯片后复制了前两张幻灯片.当关注当前索引的slideIndex是幻灯片数减1时,它会将滑块重置为零.所以你有一个无限滑块.
问题
当我在第一张幻灯片上并且之前单击时我也想要应用效果时出现问题.它基本上应该这样做,但不能将滑块重置为零,而是重置幻灯片的末尾.
@H_419_22@var slider = $('.slider'); var slides = slider.find('.slides').children(); var slidesW = slides.width(); root.offset = -Math.abs((root.slideIndex * slides.eq(indeX).width())); console.log(root.offset); // update active class slides.removeClass('active'); // slides.eq(indeX).addClass('active'); // Add class active TweenMax.to(slides.eq(indeX),1,{ className: 'active',onComplete: function() { if (root.slideIndex >= (root.numOfSlides - 2)) { slider.find('.slides').addClass('no-transition'); slides.removeClass('active'); slides.filter(':first').addClass('active'); root.offset = 0; TweenMax.set(slider.find('.slides'),{ x: root.offset,onComplete: function() { root.slideIndex = 0; $('#footer .paging #inDicator').find('span').html('01'); return false; } }); } } }); // Remove no-transition class slider.find('.slides').removeClass('no-transition'); // Change position of ul.slides TweenMax.to(slider.find('.slides'),0.4,{ x: root.offset });
因为我有一个if语句if(root.slideIndex ===(root.numOfSlides – 2)){它总是会重置为零,当slideIndex等于root.numOfSlides – 2.所以它无所谓单击上一个或下一个,当slideIndex在幻灯片4的示例中时,它将重置为零.
我在codepen中重新创建了滑块：https://codepen.io/anon/pen/zEmozr
@H_419_22@if (dir == "ss-prev") { // root.slideIndex--; root.slideIndex = (root.slideIndex - 1 < 0) ? root.numOfSlides - 1 : root.slideIndex - 1; console.log('prev',root.slideIndeX); }
通过：
@H_419_22@if (dir == "ss-prev") { // root.slideIndex--; root.slideIndex = (root.slideIndex - 1 < 0) ? root.numOfSlides - 3 : root.slideIndex - 1; console.log('prev',root.slideIndeX); }
以上是大佬教程为你收集整理的jquery – Infinity滑块上一个按钮逻辑不起作用全部内容，希望文章能够帮你解决jquery – Infinity滑块上一个按钮逻辑不起作用所遇到的程序开发问题。
如果觉得大佬教程网站内容还不错，欢迎将大佬教程推荐给程序员好友。
本图文内容来源于网友网络收集整理提供，作为学习参考使用，版权属于原作者。
如您有任何意见或建议可联系处理。小编QQ：384754419，请注明来意。