스크롤 가능한 페이지 매김에 jQuery 슬라이더를 사용할 때 올바른 시작 위치를 얻으십시오.

Question

매우 긴 페이지 매김을 처리하기위한 스크립트를 작성하고 있습니다. 이를 위해 jQuery 슬라이더를 사용합니다.

here의 일부 수정 된 기능을 사용하고 있습니다.

이것은 지금까지 js 코드입니다. 스크립트가로드 될 때 올바른 위치 (슬라이더)로 이동하는 페이지 매김 div 만 빠져 있습니다. 초기화시 사용자가 슬라이더를 사용할 때 실행되는 동일한 함수를 실행하기 만하면됩니다.

// 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); 

고마워요!

Answer 1

우리가 같은 플러그인을 사용하는 경우 그럼 난 몰라하지만이 슬라이더 이동 코드입니다 :

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