Get correct start position when using jQuery slider for a scrollable pagination

Question

Hi!

I am building a script for handling very long paginations. For this I use jQuery slider.

I using some modified functions from here.

This is the js code so far. The only thing that is missing is the pagination div to move to the correct position (slider does) when the script loads. On initialization I just want to run the same function that runs when the user uses the slider.

    // Calculate total width
 var totalWidth = 0;
 $('.pageItem').each(function() {
  totalWidth += $(this).outerWidth(true);
 });

 // Total number of pages
 var totalPages = $('.pageItem').size();

 // Calculate current position ( starts counting at 0 )
 var currentPage = $('li').index($('.current')) + 1;

 // Scroll start position
 var scrollPosition = [currentPage / totalPages] * 100;

 $('#pagiMoreSlider').slider({
  change:   handleSliderChange,
  slide:   handleSliderChange,
  max:    100,
  value:   scrollPosition,
 });
 function handleSliderChange(e, ui){
  var maxScroll = $('#pagiMoreContent').attr('scrollWidth') - $('#pagiMoreContent').width();
  $('#pagiMoreContent').attr({
   scrollLeft: ui.value * (maxScroll / 100)
  });
 }

 // Set width pagiMore
 $('#pagiMore ul').width(totalWidth);

Thanks!

Answer 1

Well I dont know if we are using the same plugin but this is the code for moving the slider:

$('#content-slider').slider("moveTo", "-=1");
$('#content-scroll').stop();