gérer le scroll sur une pop-up de type confirm

Bonjour,

Voila j'affiche une pop-up de type confirm via l'événement onsubmit d'un formulaire html.

Ce confirm affiche un texte et l'utilisateur décide ou non donc d'envoyer ou de remodifier les infos saisies avant l'envoie.

Seulement, la liste affichée est parfois tellement longue que la fenêtre confirm est trop grande pour l'écran et on ne peut donc pas voir les boutons "ok" et "annuler"

Je voudrais donc scroller cette liste dans la fenêtre confirm.

Est-ce possible ou pas ? Si oui comment faire ? car je ne trouve pas grand chose de mon côté ...

Merci d'avance

je n'ai jamais vu de fenetre confirm avec un scroll ????

Ben justement c'est pour ça que je demande si c'est possible à faire ^^

Je n'en ai jamais vu non plus mais comme je ne connais pas grand chose au javascript je demande quand même pour le cas ou :)

Ha ... ok
Donc je confirme , non sauf émuler soi même sa fenetre confirm avec un div ...

Et c'est compliqué à faire ou pas ?

Est-ce que t'aurais un exemple de code ou quelque chose pour voir ce que ça donne à mettre en place ?

Il existe des librairies toutes faites de type walterzon ou window prototype de xilinus ...

sinon tu peux partir sur un truc du style:

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
<html>
 
   <head>
   <meta http-equiv="Content-Type" content="text/html; charset=windows-1252">
   <title>X</title>
   <style type="text/css">
   .titlebar{font-size:11px;
         font-family:verdana;
         color:white;
         font-weight:bold;
         width:100%;
         background-color:Darkslateblue;
         padding:2px;
         text-align:left;
         }
 
   .msgbox{border:outset 2px white;
         background-color:gainsboro;
         width:300px;
         height:180px;
         color:black;
         padding-left:1px;
         padding-right:2px;
         padding-top:1px;
         font-family: verdana;
         font-size:11px;
         text-align:center
           }
   .cross{border:outset 2px white;
         background-color:gainsboro;
         left:2px;
         width:18px;
         color:black;
          font-family:tahoma;
          float:right;
          margin-top:0px;
          padding-left:4px;
          padding-bottom:2px;
          padding-top:1px;
          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%;
          padding-left:30px;
          text-align:left;
          }       
 
   #testzone {position:absolute;
            top:100px;
            left:200px;
            }
   </style>
 
 <script type='text/javascript'>
 /************************************************
  Brought to you form the other end of the galaxy 
                  By SpaceFrog 
 *************************************************/                  
   function MyAlert($texte){
 
            msg=$texte
            document.getElementById('testzonetext').innerHTML=document.getElementById('texte').value;
 
            document.getElementById('trap1').value=document.getElementById('bouton1').value;
            document.getElementById('trap2').value=document.getElementById('bouton2').value;
            document.getElementById('menutitre').innerHTML=document.getElementById('titre').value
 
            document.getElementById('testzone').style.display='block';
            }      
 
 
 function buttonaction(buttonid){
         switch (buttonid){
         			case('trap1') :  alert("vous avez appuyé sur le bouton " + document.getElementById('trap1').value +" !" );
         								break;
         			case('trap2') :  alert("vous avez appuyé sur le bouton " + document.getElementById('trap2').value +" !" );
         								break;
         								}
       }
 
 
    </script>
</head>
<body>
Titre        <input type="text" id='titre' size="20" maxlength="40" />
Texte        <input type="text" id='texte' size="20" maxlength="40" />
Bouton	1		<input type="text" id='bouton1' size="20" maxlength="40" />
Bouton	2		<input type="text" id='bouton2' size="20" maxlength="40" />
 
			  <input type="button" onclick="MyAlert();"	  value="alerte"/>       
 
 
		<div id='testzone' class="msgbox" style="display:none;" >
				<div class="titlebar" >
					<div id='menutitre' style="float:left"></div>	
				  	<div class="cross" onclick="document.getElementById('testzone').style.display='none';">X</div>
 				</div>
 
				<br/>
				<br/>
				<br/>
				<div class='innerText' id='testzonetext'>	</div>
				<br/>
				<br/>
				<br/>
				<div>
					<input type="button" id="trap1" value="OK" class="bouton" onclick="document.getElementById('testzone').style.display='none';buttonaction(this.id)" style="left:0px;"/><input type="button" id="trap2" value="OK" class="bouton" onclick="document.getElementById('testzone').style.display='none';;buttonaction(this.id)" style="left:0px;"/><br/>
				</div>
 
		</div>
</body>
</html>

plutot sympa comme code. Mais je vais regarder aussi du côté des librairies que tu m'as proposé pour voir (quand j'aurai du temps !)

Je vais raccourcir la liste en attendant de trouver mieux.

Merci pour tes réponses