我遇到了Jquery UI的问题。其实我想创建一个简单的滑块。我正在使用带有Jquery的bxSlider。但是我想在每次更改滑块中的图片时实际更改页面的背景。我实际上在使用这段代码:
var updateAfterSlideTransition = function() {
if (slider.settings.infiniteLoop) {
var position = '';
// first slide
if (slider.active.index == 0) {
console.log(slider.active.index);
$('body').toggleClass('body0', 1000).removeClass();
// set the new position
position = slider.children.eq(0).position();
} else if (slider.active.index == 1) {
console.log(slider.active.index);
$('body').toggleClass('body1', 1000);
} else if (slider.active.index == 2) {
console.log(slider.active.index);
$('body').toggleClass('body2', 1000);
} else if (slider.active.index == getPagerQty() - 1 && slider.carousel) {
position = slider.children.eq((getPagerQty() - 1) * getMoveBy()).position();
// last slide
} else if (slider.active.index == slider.children.length - 1) {
position = slider.children.eq(slider.children.length - 1).position();
}
if (slider.settings.mode == 'horizontal') {
setPositionProperty(-position.left, 'reset', 0);
;
} else if (slider.settings.mode == 'vertical') {
setPositionProperty(-position.top, 'reset', 0);
;
}
}
// declare that the transition is complete
slider.working = false;
// onSlideAfter callback
slider.settings.onSlideAfter(slider.children.eq(slider.active.index), slider.oldIndex, slider.active.index);
}
当我正常使用我的滑块(从左到右)时,它实际上有效,但当我尝试向后使用它时它不起作用。如果你有任何想法让它简单或更好,请随时回答:)
答案 0 :(得分:0)
您好,我只是检查bxSlider插件,我认为您可以应用这样的功能:
function classes () {
$('body').removeClass();
var activo = $('.bx-pager-item .active').attr('data-slide-index');
var clas = 'body'+activo;
$('body').addClass(clas, 300);
}
查看此演示并提出任何问题 http://jsfiddle.net/Yq3RM/344/