Bonjour à tous,
Lors de l'ajout dynamique d'une div, la div qui est juste a côté disparait et je ne comprends pas pourquoi.
Voici le code :
le css
Code : Sélectionner tout - Visualiser dans une fenêtre à part
1
2
3
4
5
6
7
8
9
10
11 function addChatWindow(id,name) { var parent = $('#chatContainer > div:first'); var position= (parent.position()).left; var left = (position-200)+'px'; var chatWindow = $('<div class="chatWindow" id="'+id+'">'+name+'<a class="closeBtn" onclick="closeWindow('+id+')"></a><div class="divForm"><input type="text" name="cmess" /><a href="#" class="sendChatMess" onclick="sendMessage('+id+')"></a></div></div>').css('left',left).prependTo('#chatContainer'); chatWindow.animate({bottom:'0'}, "slow"); return true; }
le html
Code : Sélectionner tout - Visualiser dans une fenêtre à part
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93 #chatContainer { position : fixed; bottom :0; right : 0; height:250px; } .closeBtn { position : relative; background: url(./chat/images/negative_feedback-trans.png) no-repeat; height: 16px; width: 16px; display: block; cursor:pointer; right:2px; top:2px; float:right; } #listContainer { float:right; width:200px; height:250px; margin:0; padding:0; } #userList { border: 1px solid #DDCDC7; border-radius: 10px 10px 0 0; position:absolute; width:200px; background: #f9ede8 url(./../themes/default/styles/images/input_bg.gif) repeat-x top left; color : #6e574d; bottom : -250px; right:0; text-align:center; z-index:1009; padding-bottom:20px; } a#chatLink { border:1px solid #DDCDC7; width:200px; height:20px; position:absolute; right:0; bottom:0; color:#6e574d; text-align:center; background: #f9ede8 url(./../themes/default/styles/images/input_bg.gif) repeat-x top left; z-index :1010 } #chatLink:hover { color: #a28b8b; } .chatWindow { border-radius: 10px 10px 0 0; border: 1px solid #DDCDC7; background: #f9ede8 url(./../themes/default/styles/images/input_bg.gif) repeat-x top left; width:200px; height:250px; position:relative; right:200px; bottom:-250px; } .divForm { position :absolute; height:20px; width:200px; bottom:4px; float:left; } .sendChatMess{ position : relative; background: url(./chat/images/balloon-white-left.png) no-repeat; height: 16px; width: 16px; display: block; cursor:pointer; float:right; right:6px; } .userRow { top:10px; line-height:25px; }
En gros, quand je veux ajouter une div, cela fonctionne pour la première.
Code : Sélectionner tout - Visualiser dans une fenêtre à part
1
2
3
4
5
6
7 <div id="chatContainer"> <div id="listContainer"> <div id="userList"><img src="negative_feedback-trans.png" alt="Close" title="Close" /></div> <a href="#" id="chatLink"></a> </div> </div>
Si j'atoute une autre, la première disparait et l'autre apparait.
Une idée du problème ?
Merci.
Partager