Форум

porezon · #1 (**permalink**) 20.03.2015, 15:29

Есть чат , сделал автоскролинг в низ. Но теперь если пытаюсь прокрутить сообщения в верх скроллинг уходит всеравно в низ, как с этим можно боротся?

<script type="text/javascript">
window.onload = function(){
   var scrollinDiv = document.getElementById('responce');
   setInterval(function() {          
        scrollinDiv.scrollTop = 9999;
   }, 3000);
}

</script>

<div id="responce"></div>

demoniqus · #2 (**permalink**) 20.03.2015, 15:32

Напиши человеческим языком, что делает эта функция и найдешь причину.

porezon · #3 (**permalink**) 20.03.2015, 15:57

в чате есть сообщения, эта функция всевремя прокручивает окно чат в низ. Сообщения даже новые могут не приходить а окно чата постоянно внизу, если я вверх пытаюсь пролиснуть чат, оно меня обратно вниз скидывает

demoniqus · #4 (**permalink**) 20.03.2015, 16:00

http://javascript.ru/setInterval
Первое же предложение в описании

skrudjmakdak · #5 (**permalink**) 20.03.2015, 16:16

если вручную прокручиваешь до конца, то при добавлении сообщения будет идти автоскролл. если нет то нет)

<!DOCTYPE HTML>
<html>
<head>
	<title>example</title>
	<style>
.msg {
  padding: 5px;
  margin: 5px;
  border: 1px solid silver;
}
	</style>
</head>
<body>
  <div style="width: 200px; height: 300px; border: 1px solid black; overflow-y: scroll;" onscroll="scroll(this);">
	<div class="msg">aguadg uydg uerygtuy eguygauyer gauery guae aueaer</div>
	<div class="msg">aguadg uydg uerygtuy eguygauyer gauery guae aueaer</div>
	<div class="msg">aguadg uydg uerygtuy eguygauyer gauery guae aueaer</div>
	<div class="msg">aguadg uydg uerygtuy eguygauyer gauery guae aueaer</div>
	<div class="msg">aguadg uydg uerygtuy eguygauyer gauery guae aueaer</div>
	<div class="msg">aguadg uydg uerygtuy eguygauyer gauery guae aueaer</div>
	<div class="msg">aguadg uydg uerygtuy eguygauyer gauery guae aueaer</div>
	<div class="msg">aguadg uydg uerygtuy eguygauyer gauery guae aueaer</div>
	<div class="msg">aguadg uydg uerygtuy eguygauyer gauery guae aueaer</div>
  </div>
  <script>
var auto = false
function scroll (ths) {
	auto = ths.scrollTop + ths.clientHeight == ths.scrollHeight;
}

var div = document.querySelector('div'), i = 0;
setInterval(function () {
	var newMsg = document.createElement('div');
	newMsg.innerHTML = 'aguadg uydg uerygtuy eguy ' + (++i);
	newMsg.setAttribute('class', 'msg');
	
	div.appendChild(newMsg);
	if (auto) {
		div.scrollTop = div.scrollHeight;
	}
}, 1000);
  </script>
</body>
</html>

porezon · #6 (**permalink**) 20.03.2015, 20:54

больше спасибо. Самый лучший способ я думаю. Только как бы сделать чтоб сразу скрол был снизу

ruslan_mart · #7 (**permalink**) 20.03.2015, 21:32

Сообщение от porezon

Только как бы сделать чтоб сразу скрол был снизу

scrollinDiv.scrollTop = 9999;

porezon · #8 (**permalink**) 20.03.2015, 21:33

а как к выше указаному коду прикрепить? а то я совсем тю-тю

danik.js · #9 (**permalink**) 20.03.2015, 22:21

Зачем тут интервал вообще? Вы че, всей толпой с ума посходили?

Алгоритм самый адекватный какой? Перед появлением нового сообщения смотрим - если скролл находится в самом низу - добавляем сообщение и докручиваем скролл. Иначе просто добавляем сообщение, оставляя скролл как есть (можно какую-нибудь нотификацию сделать, как в скайпе типа).
А вы хуетой страдаете. Обсуждаете костыль, да еще и "самым лучшим способом" его называете

)

porezon · #10 (**permalink**) 23.03.2015, 11:10

еше есть варианты как сделать? желательно готовые

Форум

Справочник

Discord чат

Курсы javascript