Taille après réduction d'une div
Bonjour, je commence tout juste à créer un chat.
J'ai besoin de créer un bouton pour que l'utilisateur puisse réduire ses fenêtres de discussion. Cependant chaque conversation a une taille différente (plus il y a de messages, plus la fenêtre est grande), sa largeur ne change pas mais sa hauteur varie.
Lorsque j’exécute mon code, la valeur de la hauteur ne change pas en fonction de la discussion sélectionnée. Cela crée un problème lorsque l'on réduit les fenêtres, la taille n'est pas cohérente.
Voici mon code :
Code:
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
|
etatBoucle = true;
onRemoveChatWindow(): void {
if (this.etatBoucle) {
this.heightWindow = document.getElementById('chat-window').offsetHeight + 'px';
this.widthWindow = document.getElementById('chat-window').offsetWidth + 'px';
this.etatBoucle = false;
}
else {
document.getElementById('chat-window').style.height = this.heightWindow;
document.getElementById('chat-window').style.width = this.widthWindow;
this.etatBoucle = true;
}
} |
Code:
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
|
<div class="chat-window-container">
<div class="chat-window">
<div class="panel-container" id="chat-window">
<div class="panel panel-default">
<div class="panel-btn">
<button class="panel-btn remove"
title="Réduire la fenêtre"
(click)="onRemoveChatWindow()">
<i class="glyphicon glyphicon-minus"></i>
</button>
</div>
</div>
</div>
</div>
</div> |
J'espère que je suis assez clair dans mes explications ...
Merci d'avance !
