création de fenetre html

bonjours, j'ai codé cette petite fenêtre car j'ai pas trouver d'autre solution pour avoir un choix de oui ou non. Si il y a une meilleur solution je suis preneur^^.
tout marche bien que là :), on ne peut déplacer la fenêtre que grâce à la barre de titre comme prévu. Mais après une fois, ça ne marche plus, la fenêtre bouge que l'on appuie n'importe où, je comprend pourquoi mais je ne vois pas comment régler le problème ...

merci d'avance

voici le code: (je mets en rouge le problème et le html qui lui est attaché pour le déplacent en pièce jointe) Pièce jointe 60772

Code:

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
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
<html>
<head>
<script language="javascript" src="dom-drag.html"></script>
<style>

.titlebar{	border:outset 1px black;
  		font-size:16px;
		font-family:arial;
		color:white;
		font-weight:bold;
		width:390;
		background-color:#005DCD;
		padding:4px;
		text-align:left;
		cursor:default;
 	    	line-height:12px;

}
		  
.msgbox{	 border:outset 1px black;
		 background-color:gainsboro;
		 width:399px;
		 height:200px;
		 color:green;
		 padding-left:0px;
		 padding-right:1px;
		 padding-top:0px;
		 font-family: arial;
		 font-size:14px;
		 text-align:center;
		 background-image:url("attention.png");
		 background-position: 1.4cm 21.2cm;		 

}

.cross{		
		id:"delete";
		BORDER: black 1px solid;
		background-color:#D52F2F;
		font-size:18px;
		width:21px;
		color:white;
	     	float:right;
 	     	margin-top:-2px;
		padding-left:9px;
 	    	padding-bottom:5px;
 	    	padding-top:0px;
 	    	line-height:10px;
		cursor:default;


}

.bouton{	 width:80px;
		 height:25px;
		 border:oustet 2px silver;
		 position:relative;
		 font-size:11px;
		 font-family: tahoma;
}
 
.innerText{	 width:100%;
		 text-align:center; 
		 font-weight:bold; 
		 cursor:default;
}		 

#testzone {
position:relative;
}

#testzone2 {
position:relative;
}
</style>

<script>

function Kill_LI( this_){
  var O_Li = this_.parentNode;
  var O_Ul = O_Li.parentNode;
  O_Ul.removeChild( O_Li);
}

function voleur(e){ 
return false; 
}

function bien(){ 
return true; 
}

document.onselectstart=new Function ("return false");

if (window.sidebar){
  document.onmousedown=voleur;
  document.onclick=bien;
}

</script> 
 
</head>

<body>
<div id='testzone' class="msgbox" >
<div id='testzone2' OnMouseDown='Drag.lancement(document.getElementById("testzone"));' class="titlebar">
<div class="cross"  style="cursor: Pointer;" onclick="Kill_LI(testzone);"><b>x</b></div>&nbsp nouvelle fenêtre 1</div>
 
<br/>
<br/>
<div class='innerText'>

Pour poursuivre veuillez répondre à cette question : <br><br>
Avez vous une toute petite boite ? 

</div>
<br/><br/>
<div>
<input type="button" id="trap1" value="OUI" class="bouton" onclick= value="encore" style="left:-32px;cursor:  Pointer;"/>
<input type="button" id="trap" value="NON" class="bouton" onclick= value="raté" style="left:20px;cursor: Pointer;"/>
</div></div>


</body></html>