Javascript-форум (https://javascript.ru/forum/)
-   Элементы интерфейса (https://javascript.ru/forum/dom-window/)
-   -   JQuery подгрузка данных при прокрутке вверх (https://javascript.ru/forum/dom-window/39672-jquery-podgruzka-dannykh-pri-prokrutke-vverkh.html)

tweaker3 08.07.2013 01:28

JQuery подгрузка данных при прокрутке вверх
 
Здравствуйте,
Как можно реализовать подгрузку данных при скроллинге вверх?
Пробую делать так:
var inner = $('#chat-messages-inner');
$("#chat-messages").scroll(function(){
		if(!$(this).scrollTop()) {
			$(inner).prepend("1<br>");
			$(inner).prepend("1<br>");
			$(inner).prepend("1<br>");
			$(inner).prepend("1<br>");
			$(inner).prepend("1<br>");	
		}
	});

Как только высота в диве становиться равна нулю, скрол уходит вверх до конца, как сделать так чтобы скролл оставался на прежнем месте и так же данные, при достижения нулевой высоты, тоже оставались на прежнем месте.
Пример: как реализованы диалоги в вк.

tweaker3 08.07.2013 12:31

upup

tweaker3 15.07.2013 09:36

up

skrudjmakdak 15.07.2013 09:59

вот, как вариант:
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
<html>
	<head>
		<title>123</title>
		<style type="text/css">
		body
		{
		margin: 0px;
		padding: 0px;
		}
		
		.block
		{
		width: 400px;
		border: 1px solid black;
		}
		</style>
	</head>
<body>
	<div class="div1">
		<div class="div2 block" style="height: 1000px;"></div>
	</div>
	<script type="text/javascript" src="http://code.jquery.com/jquery-1.10.2.min.js"></script>
	<script type="text/javascript">
	var div1 = $('.div1');
	var div2 = $('.div2');
	var height = 150;
	$(window).scroll(function()
		{
		if ($(this).scrollTop() == 0)
			{
			$(div1).prepend('<div class="block" style="height: ' + height + 'px;">123</div>');
			height += 20;
			if (height > 300)
				height = 100;
			
			var h = $(div1).children().eq(0).height();
			$(window).scrollTop(h);
			}
		});
	</script>
</body>
</html>


Часовой пояс GMT +3, время: 00:27.