@coverme

Что нужно дописать в js,чтоб слайды в слайдере скролились автоматически?

Что нужно дописать чтоб был автоплей слайдов в слайдере?
Есть такой вот кусок кода,хотя вполне возможно я нашёл у себя в js не совсем то,так как от js я далёк,но скорее всего это он:

/* Oasis */
  var _oasis_timeouts = [];
  var _oasis_delay = 6000;

  $('#oasis .oasis-gallery-buttons__item').on('click', function(e){
    $('.oasis-gallery-buttons__item_active').removeClass('oasis-gallery-buttons__item_active');
    $('.oasis-gallery .slides-images__item_active').removeClass('slides-images__item_active');

    $(this).addClass('oasis-gallery-buttons__item_active');
    $('.oasis-gallery .slides-images__item').eq($(this).index()).addClass('slides-images__item_active');

    for (var i = 0; i < _oasis_timeouts.length; i++)
    {
      clearTimeout(_oasis_timeouts[i]);
    }

    _oasis_timeouts = [];

    _oasis_timeouts.push(setTimeout(function(){
      rotateOasis();
    }, _oasis_delay));
  });

  $('#oasis .slides-controls__item').on('click', function(e){
    var next_item = ($('#oasis .oasis-gallery-buttons__item_active').next().length > 0 ? $('#oasis .oasis-gallery-buttons__item_active').next() : $('#oasis .oasis-gallery-buttons__item:first'));

    if ($(this).hasClass('slides-controls__item_left'))
    {
      next_item = ($('#oasis .oasis-gallery-buttons__item_active').prev().length > 0 ? $('#oasis .oasis-gallery-buttons__item_active').prev() : $('#oasis .oasis-gallery-buttons__item:last'));
    }

    $(next_item).click();
  });

  function rotateOasis()
  {
    /*var next_item = ($('#oasis .oasis-gallery-buttons__item_active').next().length > 0 ? $('#oasis .oasis-gallery-buttons__item_active').next() : $('#oasis .oasis-gallery-buttons__item:first'));
    $(next_item).click();

    _oasis_timeouts.push(setTimeout(function(){
      rotateOasis();
    }, _oasis_delay));*/
  }

  _oasis_timeouts.push(setTimeout(function(){
    rotateOasis();
  }, _oasis_delay));

  if (isMobile())
  {
    $('.oasis-gallery').swipe({
      swipeStatus:function(event, phase, direction, distance, duration, fingerCount) {
        if (distance < 50)
        {
          distance = 0;
        }
        
        $('.oasis-gallery .slides-images__item_active').css({
          'left': (direction == 'left' ? -distance : distance) + 'px'
        });

        if (phase === $.fn.swipe.phases.PHASE_END || phase === $.fn.swipe.phases.PHASE_CANCEL) {
          $('.oasis-gallery .slides-images__item').css({
            'left': 0 + 'px'
          });
        }
      },
      swipeLeft:function() {
        var next_item = ($('#oasis .oasis-gallery-buttons__item_active').next().length > 0 ? $('#oasis .oasis-gallery-buttons__item_active').next() : false);
        
        if (next_item)
        {
          $('.oasis-gallery .slides-controls__item_right').click();
        }
      },
      swipeRight:function() {
        var next_item = ($('#oasis .oasis-gallery-buttons__item_active').prev().length > 0 ? $('#oasis .oasis-gallery-buttons__item_active').prev() : false);
        
        if (next_item)
        {
          $('.oasis-gallery .slides-controls__item_left').click();
        }
      },
      allowPageScroll:$.fn.swipe.pageScroll.AUTO,
      triggerOnTouchEnd:false,
      threshold:200
    });
  }
  /* \Oasis */

  /* Elite */
  $('.elite-menu-item').on('click', function(e){
    $('.elite-menu-item_active').removeClass('elite-menu-item_active');
    $('.elite-images__item').removeClass('slides-images__item_active');
    $('.elite-item').removeClass('slides__item_active');

    $(this).addClass('elite-menu-item_active');
    $('.elite-images__item').eq($(this).index()).addClass('slides-images__item_active');
    $('.elite-item').eq($(this).index()).addClass('slides__item_active');
  });
  /* \Elite */

  /* Gallery */
  $('.block_gallery .slides-controls__item').on('click', function(e){
    var next_item = ($('.block_gallery .slides-images__item_active').next().length > 0 ? $('.block_gallery .slides-images__item_active').next() : $('.block_gallery .slides-images__item:first'));
  
    if ($(this).hasClass('slides-controls__item_left'))
    {
      next_item = ($('.block_gallery .slides-images__item_active').prev().length > 0 ? $('.block_gallery .slides-images__item_active').prev() : $('.block_gallery .slides-images__item:last'));
    }

    $('.block_gallery .slides-images__item_active').removeClass('slides-images__item_active');  
    $(next_item).addClass('slides-images__item_active');  
  });


  if (isMobile())
  {
    $('#gallery').swipe({
      swipeStatus:function(event, phase, direction, distance, duration, fingerCount) {
        if (distance < 50)
        {
          distance = 0;
        }
        
        $('#gallery .slides-images__item_active').css({
          'left': (direction == 'left' ? -distance : distance) + 'px'
        });

        if (phase === $.fn.swipe.phases.PHASE_END || phase === $.fn.swipe.phases.PHASE_CANCEL) {
          $('#gallery .slides-images__item').css({
            'left': 0 + 'px'
          });
        }
      },
      swipeLeft:function() {
        var next_item = ($('.block_gallery .slides-images__item_active').next().length > 0 ? $('.block_gallery .slides-images__item_active').next() : false);
        
        if (next_item)
        {
          $('#gallery .slides-controls__item_right').click();
        }
      },
      swipeRight:function() {
        var next_item = ($('.block_gallery .slides-images__item_active').prev().length > 0 ? $('.block_gallery .slides-images__item_active').prev() : false);
        
        if (next_item)
        {
          $('#gallery .slides-controls__item_left').click();
        }
      },
      allowPageScroll:$.fn.swipe.pageScroll.AUTO,
      triggerOnTouchEnd:false,
      threshold:200
    });
  }
  /* \Gallery */
  • Вопрос задан
  • 56 просмотров
Пригласить эксперта
Ответы на вопрос 1
@marki1404
Я Front-end програмист
var myIndex = 0;
carousel();

function carousel() {
  var i;
  var x = document.getElementsByClassName("mySlides");
  for (i = 0; i < x.length; i++) {
    x[i].style.display = "none";
  }
  myIndex++;
  if (myIndex > x.length) {myIndex = 1}    
  x[myIndex-1].style.display = "block";
  setTimeout(carousel, 3600);    
}

Вот тебе автоматический слайдер чуток переделай код и готово
Ответ написан
Ваш ответ на вопрос

Войдите, чтобы написать ответ

Войти через центр авторизации
Похожие вопросы