Javascript-форум (https://javascript.ru/forum/)
-   Общие вопросы Javascript (https://javascript.ru/forum/misc/)
-   -   Прокрутка скролла для чата (https://javascript.ru/forum/misc/41772-prokrutka-skrolla-dlya-chata.html)

Wolfak 28.09.2013 21:40

Прокрутка скролла для чата
 
Добрый вечер. Пишу чат для своего проекта, но никак не могу сделать автоматическую прокрутку скролла в iframe.

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

Мой код:
<script language="JavaScript">
window.onload=function() {
var heighfr = window.innerHeight;
heighfr = heighfr - 260;

if(heighfr < 250) {
heighfr = 250;
}

if(heighfr > 500) {
heighfr = 500;
}
document.getElementById("ifr").style.height=heighfr+"px";
}
</script>

<div id="chat">
<iframe id="ifr" srcdoc="chatcont" name="chatfr" align="left" width="696px" height="300px" frameborder="0"><span style="color:#9e3239; font-size:20px;">Ваш браузер не поддерживается.</span></iframe>
</div>

ruslan_mart 29.09.2013 04:17

Ну так внутри фрейма:

window.scrollTo(0, 9999);

Wolfak 29.09.2013 12:16

Цитата:

Сообщение от Ruslan_xDD (Сообщение 274123)
Ну так внутри фрейма:

window.scrollTo(0, 9999);

А можно поподробнее как это сделать? пробовал, не помогает.
Содержимое фрейма у меня наполняется в PHP так :
$content = file_get_contents(ROOT_DIR . '/templates/chat/chat.tpl');

for($i = 0; $i < 22; $i++) {
$chatcont .= "$i<br>";
}

$searchtag = 'chatcont';
$content = str_replace($searchtag, $chatcont, $content);
$tpl->set_value('CONTENT',$content);

ruslan_mart 29.09.2013 12:20

<script type="text/javascript">
window.onload = function() {
   this.scrollTo(0, 9999);
}
</script>

Wolfak 29.09.2013 13:39

Цитата:

Сообщение от Ruslan_xDD (Сообщение 274159)
<script type="text/javascript">
window.onload = function() {
   this.scrollTo(0, 9999);
}
</script>

Если вывожу так:
for($i = 0; $i < 22; $i++) {
$chatcont .= "$i<br>";
$chatcont .= "<script type=\"text/javascript\">
window.onload = function() {
   this.scrollTo(0, 9999);
}
</script>";
}

То выводится только цифра 0 во фрейме.
Если так:
for($i = 0; $i < 22; $i++) {
$chatcont .= "$i<br>";
}
$chatcont .= "<script type=\"text/javascript\">
window.onload = function() {
   this.scrollTo(0, 9999);
}
</script>";

То не работает.

Wolfak 29.09.2013 14:33

Переделал html код так, что теперь чат выводится в div со скроллом.
<script type="text/javascript">
window.onload = function() {
   this.scrollTo(0, 9999);
}
</script>

Ваш скрипт в любой вставке убирает скролл заданный с помощью
overflow-y:auto;

Wolfak 29.09.2013 21:04

Вопрос больше не актуален. Переписал свой чат с использованием материала из этой статьи. Спасибо за попытку помочь.
Прошу закрыть топик.

Wolfak 03.10.2013 10:03

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

BETEPAH 03.10.2013 11:15

Цитата:

Сообщение от Wolfak (Сообщение 274849)
Подскажите пожалуйста, как можно реализовать, чтобы скрол опускался только после прихода нового сообщения, не в конец списка, а на рдно сообщение. А то использую скроллту нельзя читать историю чата, постоянно откидывает в конец.

Лучше поставить проверку положения скролла и если он дальше, чем, например, 500px от конца фрейма, прокрутку не делать.

Wolfak 03.10.2013 18:49

Подскажите, как сделать такую проверку?


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