수평 무한 스크롤

div 안에 무한 스크롤을 적용하고 싶은 이미지의 가로 목록이 있습니다. 이상적으로 이것은 단지 창 자체 일 것이지만 지금 당장은 div입니다.수평 무한 스크롤

이것은 폴 아이리쉬의 무한한 스크롤 (?)에 대한 해킹과 관련이 있다고 생각합니다. 이제 div의 내부에서 작동하기 위해 localMode를 1.2로 true로 설정할 수 있다는 것을 알고 있지만, 브라우저가 "다음 페이지"가 될 내용을 생각하도록 속일 필요가 있습니다. 나는 그 일을 어떻게하는지 알 수 없다. 나는 수색하고 찾았으며, 이제 나는 천재들에게 당신의 훌륭한 생각을 제공하는 것을 좋아할 것입니다. 감사!

출처

2012-10-09 user1464317

요소를 가로로 정렬하려면 width 속성을 제공하는 컨테이너가 필요합니다. 당신이 당신의 body 바로 아래에 해당 컨테이너를 사용하는 경우

$(document).ready(function(){ 
    var totalWidth = 0; 
    $('#container').children().each(function(){ 
    totalWidth += $(this).outerWidth(); 
    }); 
    $('#container').css('width', totalWidth); 
});

을하고 bodyoverflow:scroll 제공 : 그 동적 그냥 이런 식으로 뭔가를 추가 할 수 있도록합니다. 그런 다음 컨테이너에 body과 html 높이를 100 %로 지정하면 가로로 늘어서야합니다.

출처

2012-10-09 14:10:35 Sem

감사합니다. 그것은 확실히 도움이됩니다. 나는 여전히 수평 무한 스크롤에 접근하는 방법에 대해 내 머리를 감쌀 수 없다. 나는 그것이 div 안에서 일할 수 있다는 것을 안다. 그리고 그것이 수직적 인 것과 반대로 수평 적으로 행해질 수 있다는 것을 안다. 나는 그것을 얻을 수 없다. jquery 플러그인은 https://github.com/paulirish/infinite-scroll/입니다. – user1464317

쉽습니다. 'width'가 윈도우의 너비를 결코 넘나들므로 자동 수평 스크롤은 불가능합니다. 그럴 경우 텍스트 한 줄을 입력하지 않고 텍스트를 읽는 것이 짜증이되지 않습니까? – Sem

'outerWidth (true)'에'true '를 전달하여 계산에 여백을 포함하게 할 수 있습니다. 자세한 내용은 http://api.jquery.com/outerWidth/를 참조하십시오. –

Lazyload는 제가 찾고있는 것입니다. http://www.appelsiini.net/projects/lazyload. #image_list라는 컨테이너 내에 이미지 목록이 있습니다.

$(document).ready(function() { 
    $("#image_list img").lazyload({ 
      effect : "fadeIn" 

     }); 
});

대단히 자명합니다. 그리고 내가 설명하는 가장 좋은 일을하지 않은 수평 무한 목록은이 사업부 내에 포함되어 있습니다 :

#image_list { 
margin: 0 auto; 
white-space: nowrap; 
width: auto; 
overflow: auto; 
clear: both; 
position: relative; 
}

그것은 파이어 폭스가 그것을 포장하지 거부하지만 때문에 한 실제없는 목록입니다! 따라서 끝없는 td가있는 테이블 행입니다.

<table> 
<tbody> 
    <tr> 
    <td><img src="img1.jpg" /></td> 
    <td><img src="img2.jpg" /></td> 
     ... 
    <td><img src="img34.jpg" /></td> 
    </tr> 
</tbody> 
</table>

출처

2012-10-24 13:49:48 user1464317

수평 무한 스크롤

답변

관련 문제