Chat-o-matic: Userlist refresh; rare geval

Hoi,

Ik heb een raar geval, wanneer ik de pagina laad waar de chat in staat; wanneer ik dus nog niet in de chat kan praten, en niemand gaat weg of komt erin:
Daarna, wanneer ik inlog of iemand anders logt in of iemand anders gaat weg:
Het lijkt wel of de userlist 1pixel naar links gaat waardoor er een dikke rand komt boven en rechts. Hoe kan dit?

LET OP:
Hoe log je in:
Element inspecteren -> Console en typ:

Codeblok (voorbeeld.php):

1

socket.emit(requestUsername, { value: hiereenrandomnaam });

Demo link: http://apps.jreitsma.eu:3101/

Ik neem aan dat dit je topic op stackoverflow is

Als ik naar dat socket.on(refreshUsers.. kijk, zie ik dat je iets als dit aanmaakt:

Codeblok (voorbeeld.php):

1
2
3
4
5
6
7

Zoek de fout.

Ik snap trouwens niet waarom je een div in een ul doet.. Je html klopt niet echt, bij je buildChat() doe je hetzelfde btw..

Sjoerd schreef:

Ik neem aan dat dit je topic op stackoverflow is

Als ik naar dat socket.on(refreshUsers.. kijk, zie ik dat je iets als dit aanmaakt:

Codeblok (voorbeeld.php):

1
2
3
4
5
6
7

Zoek de fout.

Ik snap trouwens niet waarom je een div in een ul doet.. Je html klopt niet echt, bij je buildChat() doe je hetzelfde btw..

Ja, dat had Cbroe ook al gemeld. Alleen fixt dit niet het probleem.

Oh, ik zie in je source dat je dit nu al hebt veranderd..

toevoeging op 13 februari 2014, 17:35:30:
Bij het updaten van de userList moet je de div zelf vervangen, of alleen de inhoud. Niet een div maken met hetzelfde id en die erin zetten..

Je hebt nu:

Codeblok (voorbeeld.php):

1
2
3

en als een gebruiker joined:

Codeblok (voorbeeld.php):

1
2
3
4
5

Oh, als dat het probleem is; welk geval is beter:
Als er een user erbij komt of weggehaald alleen de users erbij halen (met .append())
Of gewoon de hele userlist refreshen?

Zou aan mij kunnen liggen maar ik zie die dikke(re) lijnen niet? (Kan misschien komen doordat er rechts een scrollbar zit...)

Nielsjojo schreef:

Zou aan mij kunnen liggen maar ik zie die dikke(re) lijnen niet? (Kan misschien komen doordat er rechts een scrollbar zit...)

Weet niet, maar het is al opgelost:

Codeblok (voorbeeld.php):

1
2
3
4
5
6
7
8
9
10
11

socket.on(addUser, function(addData) {
console.log("Adding user...");

$( ".users" ).append("

Afbeelding niet beschikbaarDe oorspronkelijke afbeelding of link ontbreekt."+ addData.user +"

");
});

socket.on(removeUser, function(removeData) {
console.log("Removing user...");

$( ".users > #"+ removeData.user).remove();
});