Jquery 이미지 스크롤러가 다음 이미지로 전환하지 않습니다.

Question

구현하고자하는 이미지 스크롤러가 있습니다. 이미지 스크롤은 작동하지만 수평 대신 수직으로 이동합니다. 여기에 지금까지 무엇을 가지고 있습니다 :

<a href = "#" id = "btnNext">Next Image</a> 

$('#btnNext').click(function() { 
    //Calls new image with value true, meaning next image 
    newImage(true); 
    return false; 
}); 

function newImage(direction) { 
    //Get the current selected item (with selected class), if none was found, get the first item 
    current_image = $('#imageGallery li.selected').length ? $('#imageGallery li.selected') : $('#imageGallery li:first'); 

    //If determines slideshow direction 
    if (direction) { //Next image 
     //Get next sibling 
     next_image = (current_image.next().length) ? current_image.next() : $('#imageGallery li:first'); 
    } else { //Previous image 
     //Get previous sibling 
     next_image = (current_image.prev().length) ? current_image.prev() : $('#imageGallery li:last'); 
    } 

    //Clear selected class 
    $('#imageGallery li').removeClass('selected'); 

    //Reassign selected class to current image 
    next_image.addClass('selected'); 

    //Scroll images 
    $('#images').scrollTo(next_image, 800); 
} 

업데이트 : 여기 내 quesions 있습니다 1) 어떻게이 그것을 수평으로 이동하기 위해 수정합니까이? 2) .scrollTo()를 사용하지 않고 이와 같은 이미지 스크롤러를 만드는 방법이 있습니까?

Answer 1

갤러리를 세로로가 아닌 가로로 이동하려는 것으로 가정합니다. (당신이 질문에 모두). 이것은 단지 CSS 문제입니다 : 목록을 수평으로 표시되도록 변경하십시오 (예 : display: inline-block 또는 float: left) scrollTo 플러그인이이를 수행해야합니다.

scrollTo 플러그인 없이도이 작업을 수행 할 수 있습니다. 플러그인은 jQuery 애니메이션 기능을 사용하여 페이지를 돌아 다니며 원한다면 동일하게 수행 할 수 있습니다. :) 갤러리에서 그림을 움직이기 위해 애니메이션을 사용하는 빠른 jsFiddle이 있습니다. 분명히 꽤 많은 작업이 필요합니다. (마지막 사진에서 처음으로 돌아 가지 않고 한 방향으로 만 이동하고 그림 너비를 계산하지 않습니다.)하지만 어떻게하면 될지에 대한 아이디어를 줄 것입니다. 끝내라.

http://jsfiddle.net/meloncholy/KzBzT/