Insertion dynamique & gestion de la position dans la page

Insertion dynamique & gestion de la position dans la page - HTML/CSS - Programmation

Marsh Posté le 18-01-2015 à 10:49:01    

Hello :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.  
http://reho.st/preview/self/a0d786be50002b511df22f0b639ccfb893010aa6.png
 
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 :
  1. function pushHistory(where, who, what, avatar) {
  2.     var message = container.innerHTML;
  3.     if(who == 0) {
  4.         message = "<div class=\"bubble-left\"><div class=\"bubble-left-avatar\"><img src=\"" + avatar + "\" /></div><p>" + what + "</p></div>" + message;
  5.              
  6.     } else {
  7.         message = "<div class=\"bubble-right\"><div class=\"bubble-right-avatar\"><img src=\"" + avatar + "\" /></div><p>" + what + "</p></div>" + message;
  8.     }
  9.     container.innerHTML = message;
  10. }


 
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 :o
 
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  :hello:  

Reply

Marsh Posté le 18-01-2015 à 10:49:01   

Reply

Sujets relatifs:

Leave a Replay

Make sure you enter the(*)required information where indicate.HTML code is not allowed