A
A
Anton2015-10-09 08:25:32
css
Anton, 2015-10-09 08:25:32

How to add auto-scroll to jquery slider?

There is a slider without auto-scrolling, please help to implement it in it.

$(document).ready(function() {
  $(".sliderBox").each(function () { 
    var obj = $(this);
    $(obj).append("<div class='nav'></div>");
    $(obj).find(".slide").each(function () {
    $(obj).find(".nav").append("<span id='nav"+$(this).index()+"' rel='"+$(this).index()+"'></span>"); 
      $(this).addClass("slide"+$(this).index());
    });
    $('#nav0').addClass("on")
    $(obj).find("span").first().addClass("on"); 
  });
  var slideWidth = $('.slide').width();
  function nextslide(){
    $('.longLine').stop(true);
    var marginNow = $('.longLine').css('marginLeft');
    var margin = marginNow.split('p');
    var count = $('.slider .longLine .slide').length;
    $('.sliderRight, .sliderLeft').hide();
    if (margin[0] == -((count-1)*slideWidth)){
      $('.slider .longLine').animate({marginLeft:0},500,function(){$('.sliderRight, .sliderLeft').show();});
      $('.nav span').removeClass('on');
      $('.nav span').first().addClass('on');
    }else{ 
      $('.slider .longLine').animate({marginLeft:margin[0] -slideWidth},500, function(){$('.sliderRight, .sliderLeft').show();});
      $('.on').next().addClass('on');
      $('.on').prev('span').removeClass('on');
    }
  }
  //if ($('.longLine').length){
  //	var set = setInterval(nextslide,1500); 
  //}	
  $(".sliderBox .nav span").click(function() { // slider click navigate
    $('.longLine').stop(true);
    var sl = $(".sliderBox"); 
    $(sl).find("span").removeClass("on"); 
    $(this).addClass("on"); 
    var obj = $(this).attr("rel"); 
    sliderJS(obj, sl); 
  });
  function sliderJS (obj, sl) { 
    var ul = $(sl).find(".longLine"); 
    var bl = $(sl).find(".slide"+obj); 
    var step = $(bl).width(); 
    $(ul).animate({marginLeft: "-"+step*obj}, 500); 
  }

Answer the question

In order to leave comments, you need to log in

1 answer(s)
G
GreatRash, 2015-10-09
@Ooos

if ($('.longLine').length){
  var set = setInterval(nextslide,1500); 
}

Didn't find what you were looking for?

Ask your question

Ask a Question

731 491 924 answers to any question