2012-06-20 5 views
3

나는 메시지 목록을 담고있는 div를 가지고있다 (chatroom 응용 프로그램이다). 각 메시지가 목록 맨 아래에 추가 될 때마다 으로 생각하고 div를 페이지 아래쪽으로 스크롤하려고합니다. 그 말이 맞지? 그래서 - 질문 # 1 : div를 아래로 스크롤하려면 어떻게해야합니까?jQuery - overflow-y로 스크롤 div : 스크롤;

이제 다음 질문은 유용성에 관한 것입니다. 사용자가 스크롤하여 이전에 게시 된 내용을 읽으면 어떻게됩니까? 갑자기 누군가 누군가 새로운 메시지를 올리 죠? 이는 jQuery가 다시 아래로 스크롤된다는 것을 의미합니다. 이것은 매우 자극적 일 수 있습니다. 이것을 처리하는 좋은 방법은 무엇입니까? 새 메시지가 추가되기 전에 스크롤 막대가 완전히 아래로 스크롤 된 경우에만 아래로 스크롤해야합니까? 그렇다면 jQuery에서이를 수행하는 방법은 무엇입니까? 아니면 더 유용한 솔루션이 있습니까?

답변

2

스크롤바의 위치를 ​​window.pageYOffset으로 가져온 다음 window.scrollTo(0, y)을 사용하여 스크롤 할 수 있습니다.

또는 jquery에서 $('#mydiv').scrollTop(newmsg_top)을 사용하여 새 메시지로 스크롤 할 수도 있습니다. 여기 var newmsg_top = parseInt($('#mydiv li:last').offset().top);

#mydiv 모든 메시지와 사업부입니다

.
따라서 #mydiv li:last은 마지막 메시지를 가리 킵니다.
offset() 문서에 대한 요소의 현재 위치를 반환하고 대신 당신이 갈 수있는 부모에 대한 상대적 위치를 원하는 경우에 당신은 .top

에 의해 최고 위치를 얻을 수 있습니다 position()

편집 :jsfiddle 여기에서 일하고있어 here. 이것을 봐주세요. 참고 :. 당신은 당신이 마지막 요소를보고있는 경우에만 내려 가서

+0

죄송합니다 추가, 끝으로 스크롤 것이다, 나는 "새로운 메시지의 최고 상쇄"가 무엇인지 또는 그것을 얻는 방법을 모른다. – StackOverflowNewbie

+0

나는 조금 편집했는데, 작동하도록 할 수 있는지 알아 보도록한다. 그렇지 않으면 코드의 전체 블록을 타이핑하려고 할 것이다. – tarashish

+0

OK, 나는'scrollTop'을 사용하는 방법을 알아 냈다. 유용성 문제는 어떻습니까? 당신이 뭔가를 읽기 위해 위로 스크롤했을 때 맨 아래로 계속 스크롤하면 짜증나게 될 것이라고 생각하지 않습니까? – StackOverflowNewbie

1

(사용자의 사용성 문제의 해결을 위해) //이 후

$("#mydiv").append("My data"); 
var newmsg_top = parseInt($('#mydiv')[0].scrollHeight); 
$('#mydiv').scrollTop(newmsg_top);