我在这里找到了一个图像滑块并尝试修改我现有的滑块,我必须更像我找到的滑块。在修补它之后,即使工作也无法得到任何东西。
我创建了这个以显示我想要做的事情: https://jsfiddle.net/xeud0rw6/
我基于此... http://gualini.adostudio.it/realizations_2.html#
我添加了我的身份
#thumb
和
#big
试图修改它以使其工作,但我想我错过了一些东西。有谁看到我做错了什么?
答案 0 :(得分:0)
请不要让我们让您的错误代码有效,这个问题对除了您自己以外的任何人都无济于事。我建议你接近插件的作者,或者至少指定你所说的插件。
答案 1 :(得分:0)
试试这个:
$(document).ready(function(){
var realSlider= jQuery("#big ul").bxSlider({
speed:1000,
pager:false,
nextText:'',
prevText:'',
infiniteLoop:false,
hideControlOnEnd:true,
onSlideBefore:function($slideElement, oldIndex, newIndex){
changeRealThumb(realThumbSlider,newIndex);
}
});
var realThumbSlider=jQuery("#big ul").bxSlider({
minSlides: 4,
maxSlides: 4,
slideWidth: 156,
slideMargin: 12,
moveSlides: 1,
pager:false,
speed:1000,
infiniteLoop:false,
hideControlOnEnd:true,
nextText:'<span></span>',
prevText:'<span></span>',
onSlideBefore:function($slideElement, oldIndex, newIndex){
/*jQuery("#thumb ul .active").removeClass("active");
$slideElement.addClass("active"); */
}
});
linkRealSliders(realSlider,realThumbSlider);
if(jQuery("#thumb li").length<5){
jQuery("#thumb .bx-next").hide();
}
// sincronizza sliders realizzazioni
function linkRealSliders(bigS,thumbS){
jQuery("#thumb ul").on("click","a",function(event){
event.preventDefault();
var newIndex=jQuery(this).parent().attr("slideIndex");
bigS.goToSlide(newIndex);
});
}
//slider!=$thumbSlider. slider is the realslider
function changeRealThumb(slider,newIndex){
var $thumbS=jQuery("#thumb");
$thumbS.find('.active').removeClass("active");
$thumbS.find('li[slideIndex="'+newIndex+'"]').addClass("active");
if(slider.getSlideCount()-newIndex>=4)slider.goToSlide(newIndex);
else slider.goToSlide(slider.getSlideCount()-4);
}
});