무한 스크롤을 사용하여 replaceState()
을 구현하는 데 어려움을 겪은 후 무한 Ajax 스크롤을 구입하기 만하면됩니다. 당신이 알다시피무한 Ajax 스크롤 : 역사와 어려움
function infiniteScroll() {
// Init infinite scroll
var ias = $.ias({
container: '#masonry-filter',
item: '.post',
pagination: '.nav-links',
next: '.nav-previous a'
});
// Run isotope on additional load
ias.on('render', function(newElements) {
$(newElements).css({ opacity: 0 });
});
ias.on('rendered', function(newElements) {
$('#masonry-filter').isotope('appended', $(newElements));
});
ias.extension(new IASTriggerExtension({ offset: 100 }));
ias.extension(new IASPagingExtension());
ias.extension(new IASHistoryExtension({prev: '.nav-next a' }));
}
내가 Metafizzy의 동위 원소 플러그인과 함께이를 사용하고 있습니다 : 나는 다음과 같은 코드가 제대로 작동하도록 설정 모든 것을 얻을 관리했다. 나는 또한 Wordpress에서 이것을 사용하고 있으며 이것을 전형적인 Wordpress 페이지 매김에 연결하고있다.
모든 것이 제대로 작동하는 것처럼 보이지만 의도 한대로 작동하지 않습니다. 제 가정은 http://tumbledry.org/처럼 다소 시간이 흐른 후 페이지를 떠나 브라우저를 다시 클릭하면 링크를 클릭 할 때와 정확히 동일한 위치로 사용자를 이동시킵니다. 플러그인은 WordPress가 기본적으로 페이지 매김 (example.com/page/2)에 사용하는 URL 구조와 동일한 replaceState()
을 사용하는 것 같습니다. 이것이 의도적으로 이루어 졌는지 아니면 우연인지는 알 수 없습니다. 그 결과, 게시물을 클릭 한 다음 브라우저의 뒤로 버튼을 누르면 사실상 example.com/page/2 페이지로 이동합니다. 여기에는 페이지 상단에 최신 게시물을 표시하는 버튼이 있습니다. . 그것은 원래의 게시물 페이지 나 내가 클릭 한 포스트가있는 페이지의 정확한 지점으로 이동하지 않습니다 (일반적으로 페이지의 맨 아래로 이동합니다). 또한 페이지 상단의 버튼을 클릭하여 최신 게시물을 표시하면 내 코드에서 볼 수 있듯이 페이지 하단에 최신 게시물이 추가됩니다.
나는 비틀 거리는 블로그 작품으로 작동하고 싶습니다. 링크를 클릭 한 다음 뒤로 버튼을 클릭하면 페이지의 정확한 지점으로 이동하여 새로운 게시물을로드 할 필요가 없습니다. 이것이 가능한지 또는 구현을 망쳤다면 알려주십시오. 내가 원하는 방식으로 작동하도록하는 방법을 알고 싶기 때문에 기능에 대한 심층적 인 정보를 매우 높이 평가할 것입니다.