Question

我需要每6秒钟自动更换一次幻灯片，但是我不知道如何实现

-

jQuery（function（$）{ //函数appendContent（elem）{Описаниеэлемента // $（'。circle-content .circle-content-teaser-title'）。html（elem.find（'。circle-item-title'）。text（））; // // $（'。circle-content .circle-content-teaser-desc'）。html（elem.find（'。circle-item-desc'）。text（））; // $（'。cricle-content .circle-content-readmore'）。attr（'href'，elem.find（'。circle-item-link'）。text（））; // //}

var degree = 0;

function rotateElem(elem) {
    var indexCurent;
    var countElem = $('.circle-container .circle-item').length;
    var indexElem = $('.circle-container .circle-item').index(elem);

    $('.circle-container .circle-item').each(function (index) {
        if ($(this).hasClass('selected')) {
            indexCurent = index;
        }
    });

    $('.circle-container .circle-item.selected').removeClass('selected');

    if (indexCurent < indexElem) {
        degree = degree - ((360 / countElem) * (indexElem - indexCurent));
    }
    if (indexCurent > indexElem) {
        degree = degree + ((360 / countElem) * (indexCurent - indexElem));
    }

    $('.circle-container').css({
        '-webkit-transform': 'rotate(' + degree + 'deg)',
        '-moz-transform': 'rotate(' + degree + 'deg)',
        '-ms-transform': 'rotate(' + degree + 'deg)',
        '-o-transform': 'rotate(' + degree + 'deg)',
        'transform': 'rotate(' + degree + 'deg)'
    });

    elem.addClass('selected');
}

function rotatePrev(elem) {
    $('.circle-container .circle-item.selected').removeClass('selected');

    var countElem = $('.circle-container .circle-item').length;
    var indexElem = $('.circle-container .circle-item').index(elem);
    degree = degree + (360 / countElem);

    $('.circle-container').css({
        '-webkit-transform': 'rotate(' + degree + 'deg)',
        '-moz-transform': 'rotate(' + degree + 'deg)',
        '-ms-transform': 'rotate(' + degree + 'deg)',
        '-o-transform': 'rotate(' + degree + 'deg)',
        'transform': 'rotate(' + degree + 'deg)'
    });

    elem.addClass('selected');
}

function rotateNext(elem) {
    $('.circle-container .circle-item.selected').removeClass('selected');

    var countElem = $('.circle-container .circle-item').length;
    var indexElem = $('.circle-container .circle-item').index(elem);
    degree = degree - (360 / countElem);

    $('.circle-container').css({
        '-webkit-transform': 'rotate(' + degree + 'deg)',
        '-moz-transform': 'rotate(' + degree + 'deg)',
        '-ms-transform': 'rotate(' + degree + 'deg)',
        '-o-transform': 'rotate(' + degree + 'deg)',
        'transform': 'rotate(' + degree + 'deg)'
    });

    elem.addClass('selected');
}
//Триггер
$('.circle-container .circle-item').on('click', function (e) {
    e.preventDefault();
    var elem = $(this);
    rotateElem(elem);
    appendContent(elem);
});

$('.circle-nav .circle-nav-prev a').on('click', function (e) {
    e.preventDefault();
    var prev = $('.circle-container .circle-item.selected').prev();
    if (prev.length == 0) {
        prev = $('.circle-container .circle-item:last-child');
    }
    rotatePrev(prev);
    appendContent(prev);
});

$('.circle-nav .circle-nav-next a').on('click', function (e) {
    e.preventDefault();
    var next = $('.circle-container .circle-item.selected').next();
    if (next.length == 0) {
        next = $('.circle-container .circle-item:first-child');
    }
    rotateNext(next);
    appendContent(next);
});

// appendContent($('.circle-container .circle-item.selected')); Описание элемента

var startPoint;
var endPoint;
document.addEventListener('touchstart', function (e) { // Добавляем слушателя события начала прикосновения к экрану (когда положили палец на экран)
    startPoint = e.changedTouches[0]; // Получаем данные о начальном положении прикосновения. 0 - берем первый палец, который положили на экран
}, false);

document.addEventListener('touchend', function (e) { // Добавляем слушателя события окончания прикосновения (когда убрали палец с экрана)
    endPoint = e.changedTouches[0]; // Получаем данные о конечном положении прикосновения

    var xAbs = Math.abs(startPoint.pageX - endPoint.pageX); // Получаем абсолютное значение по X разницы между началом и концом прикосновения
    var yAbs = Math.abs(startPoint.pageY - endPoint.pageY); // Получаем абсолютное значение по Y разницы между началом и концом прикосновения

    if (xAbs > 20 || yAbs > 20) { // Обрабатываем только если произошел Swipe более чем на 20px
        if (xAbs > yAbs) {
            if (endPoint.pageX < startPoint.pageX) { // Swipe влево
                $('.circle-nav .circle-nav-next a').trigger('click');
            } else { // Swipe вправо
                $('.circle-nav .circle-nav-prev a').trigger('click');
            }
        } else {
            if (endPoint.pageY < startPoint.pageY) { // Swipe вверх
                $('.circle-nav .circle-nav-next a').trigger('click');
            } else { // Swipe вниз
                $('.circle-nav .circle-nav-prev a').trigger('click');
            }
        }
    }
}, false);

}）;

Answer 1

您可以在JS中使用setInterval方法

示例：

let i=0
setInterval(function(){
    console.log(i);
    i++;
},600)

我需要每6秒重复一次jQuery函数，请帮我

1 个答案: