Логика простая. Есть контейнер, например <div id="chat"></div>
. Он должен иметь фиксированную высоту и overflow:auto. В контейнер чата мы кладем блок , например #chat-messages, для него высота уже должна быть резиновая. Таким простым способом можно добиться того, чтобы у вас появлялась полоса прокрутки для чата, при добавлении новых сообщений.
Как вывести с php: посылаете ajax-запрос к скрипту, получаете сообщения (json или любой другой формат), далее вы добавляете все эти сообщения в конец #chat-messages (Jquery: $('#chat-messages').append(message);), далее просто через тот же JS скролите блок #chat-messages до низа, чтобы человек видел самое последнее сообщение.