Ползунок bx: Как продолжить автоматическое скольжение после нажатия на пейджер по умолчанию bx?
Я хочу продолжить автоклимирование после нажатия на элемент пейджера bx.
Здесь код:
$(document).ready(function () {
$('.bxslider').bxSlider({
mode: 'horizontal', //mode: 'fade',
speed: 500,
auto: true,
infiniteLoop: true,
hideControlOnEnd: true,
useCSS: false
});
$(".bx-pager-link").click(function () {
console.log('bla');
slider = $('.bxslider').bxSlider();
slider.stopAuto();
slider.startAuto();
//slider.stopShow();
//slider.startShow();
});
});
Функция uncommented stopShow() и startShow() вообще не работает. startAuto() продолжает показ слайдов, но навигация пейджера bx заморожена. Активная точка остается активной, даже если появляется новый слайд. Как это решить?
Ответы
Ответ 1
вы можете попробовать это следующим образом:
$(document).ready(function () {
var slider = $('.bxslider').bxSlider({
mode: 'horizontal', //mode: 'fade',
speed: 500,
auto: true,
infiniteLoop: true,
hideControlOnEnd: true,
useCSS: false
});
$(".bx-pager-link").click(function () {
console.log('bla');
slider.stopAuto();
slider.startAuto();
});
});
Или вы можете использовать это:
$(document).ready(function () {
var slider = $('.bxslider').bxSlider({
mode: 'horizontal', //mode: 'fade',
speed: 500,
auto: true,
infiniteLoop: true,
hideControlOnEnd: true,
useCSS: false
});
$('.bx-pager-item a').click(function(e){
var i = $(this).index();
slider.goToSlide(i);
slider.stopAuto();
restart=setTimeout(function(){
slider.startAuto();
},500);
return false;
});
});
Вторая работа для меня.
Ответ 2
Следующий код работает нормально на сайте. Попробуйте:
var slider = $('.bxslider').bxSlider({
auto: true,
pager: false,
autoHover: true,
autoControls: true,
onSlideAfter: function() {
slider.stopAuto();
slider.startAuto();
}
});
Ответ 3
это работает для меня:
var slider = $('.bxslider').bxSlider({
auto: true,
controls: false,
onSliderLoad: function () {
$('.bx-pager-link').click(function () {
var i = $(this).data('slide-index');
slider.goToSlide(i);
slider.stopAuto();
slider.startAuto();
return false;
});
}
});
Ответ 4
var clickNextBind = function(e){
// if auto show is running, stop it
if (slider.settings.auto) el.stopAuto(); **<--- You must Delete this row.**
el.goToNextSlide();
e.preventDefault();
}
Ответ 5
Для улучшения ответа это работало для меня на обоих мобильных устройствах, когда вы нажимаете, если вы находитесь в браузере, или если вы прокручиваете, когда находитесь на телефоне, является чистым, коротким и простым:
var slider = $('.slider');
slider.bxSlider({
auto: true,
autoControls: true,
onSlideAfter: function() {
slider.startAuto()
}
});
Ответ 6
Я пробовал все вышеперечисленные решения, но мне не повезло, и я использую последнюю версию 4.1.2
В Jquery.bxslider.js добавьте "el.startAuto();"
/**
* Click next binding
*
* @param e (event)
* - DOM event object
*/
var clickNextBind = function(e){
// if auto show is running, stop it
if (slider.settings.auto) el.stopAuto();
el.goToNextSlide();
e.preventDefault();
el.startAuto();
}
/**
* Click prev binding
*
* @param e (event)
* - DOM event object
*/
var clickPrevBind = function(e){
// if auto show is running, stop it
if (slider.settings.auto) el.stopAuto();
el.goToPrevSlide();
e.preventDefault();
el.startAuto();
}
Ответ 7
Вместо использования:
$('.bx-pager-item a').click(function(e){
//blah
});
установите функцию щелчка, чтобы указать прямо на bx-prev и bx-next. Это работает лучше для меня.
$('.bx-prev, .bx-next').click(function(e){
//blah
});
Ответ 8
это работает хорошо.
<script type="text/javascript">
jQuery(document).ready(function(){
jQuery('.bxslider').bxSlider({
video: true,
useCSS: false,
});
$(".bx-controls-direction").click(function () {
console.log('bla');
slider = $('.bxslider').bxSlider();
slider.stopVideo();
slider.startVideo();
//slider.stopShow();
//slider.startShow();
});
});
</script>
Ответ 9
Этот код:
var slider = $('.bxslider').bxSlider();
$('.bx-pager-link').click(function () {
var i = $(this).attr('data-slide-index');
slider.goToSlide(i);
slider.stopAuto();
slider.startAuto();
return false;
});
Отлично работает для меня.
Ответ 10
В jquery.bxslider.min.js
найдите и скройте
r.stopAuto= function(t) {
//o.interval && (clearInterval(o.interval), o.interval = null, o.settings.autoControls && // 1 != t //&& A("start"))
},