Hello
Je suis pas trop expert Web, donc je me demandais si quelqu'un pourrai aurai une idée pour résoudre mon souci.
C'est une peu un mix entre HTML / et Javascript, je suis peut-être pas trop dans la bonne sous-cat...
Je fais une app' de chat, et le rendu de ma page est en web.
Le souci que j'ai, est quand je récupère l'historique des conversations, je les pousse dynamiquement dans la page HTML en insérant dans le sens anti-chronologique, pour que le message le plus recent soit chargé en premier:
Code :
- function pushHistory(where, who, what, avatar) {
- var message = container.innerHTML;
- if(who == 0) {
- message = "<div class=\"bubble-left\"><div class=\"bubble-left-avatar\"><img src=\"" + avatar + "\" /></div><p>" + what + "</p></div>" + message;
-
- } else {
- message = "<div class=\"bubble-right\"><div class=\"bubble-right-avatar\"><img src=\"" + avatar + "\" /></div><p>" + what + "</p></div>" + message;
- }
- container.innerHTML = message;
- }
|
Le souci, c'est que du coup vu l'état du scroll dans la page, la position du dernier message descend au fur et a mesure vu qu'il y a de plus en plus de contenu avant le dernier message.
Je pensais a sauvegarder l'offset entre le bas de page et le dernier message, et ensuite faire un scroll vers ce point une fois le nouveau message poussé.
Mais du coup, ça oscille, c'est pas très joli
Il y a pas un moyen pour que la position dans la page ne change pas, malgré que j'ajoute du contenu avant la position où se trouve le navigateur?
merci