Code de puissance de mot de passe

**kevinf** · 22/05/2007, 10h17

Salut,
j'ai trouver ce code sur un site :

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
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
126
127
128
129
130
131
132
133
134
135
136
137
138
139
140
141
142
143
144
145
<html>
<head>
<style type="text/css">
#weak, #medium
{
	border-right:solid 1px #DEDEDE;
}
 
#sm
{
	margin:0px;
	padding:0px;
	height:14px;
	font-family:Tahoma, Arial, sans-serif;
	font-size:9px;
}
 
#sm ul
{
	border:0px;
	margin:0px;
	padding:0px;
	list-style-type:none;
	text-align:center;
}
 
#sm ul li
{
	display:block;
	float:left;
	text-align:center;
	padding:0px 0px 0px 0px;
	margin:0px;
	height:14px;
}
 
.nrm
{
	width:84px;
	color:#adadad;
	text-align:center;
	padding:2px;
	background-color:#F1F1F1;
	display:block;
	vertical-align:middle;
}
 
.red
{
	width:84px;
	color:#FFFFFF;
	text-align:center;
	padding:2px;
	background-color:#FF6F6F;
	display:block;
	vertical-align:middle;
}
 
.yellow
{
	width:84px;
	color:#FFFFFF;
	text-align:center;
	padding:2px;
	background-color:#FDB14D;
	display:block;
	vertical-align:middle;
}
 
.green
{
	width:84px;
	color:#FFFFFF;
	text-align:center;
	padding:2px;
	background-color:#A0DA54;
	display:block;
	vertical-align:middle;
}
</style>
<script type="text/javascript">
function evalPwd(s)
{
	var cmpx = 0;
 
	if (s.length >= 6)
	{
		cmpx++;
 
		if (s.search("[A-Z]") != -1)
		{
			cmpx++;
		}
 
		if (s.search("[0-9]") != -1)
		{
			cmpx++;
		}
 
		if (s.length >= 8 || s.search("[\x20-\x2F\x3A-\x40\x5B-\x60\x7B-\x7E]") != -1)
		{
			cmpx++;
		}
	}
 
	if (cmpx == 0)
	{
		document.getElementById("weak").className = "nrm";
		document.getElementById("medium").className = "nrm";
		document.getElementById("strong").className = "nrm";
	}
	else if (cmpx == 1)
	{
		document.getElementById("weak").className = "red";
		document.getElementById("medium").className = "nrm";
		document.getElementById("strong").className = "nrm";
	}
	else if (cmpx == 2)
	{
		document.getElementById("weak").className = "yellow";
		document.getElementById("medium").className = "yellow";
		document.getElementById("strong").className = "nrm";
	}
	else
	{
		document.getElementById("weak").className = "green";
		document.getElementById("medium").className = "green";
		document.getElementById("strong").className = "green";
	}
}
</script>
</head>
 
<body>
<form>
<input type="text" size="24" onkeyup="evalPwd(this.value);" /><br />
<div id="sm">
<ul>
<li id="weak" class="nrm">Faible</li>
<li id="medium" class="nrm">Moyen</li>
<li id="strong" class="nrm">Fort</li>
</ul>
</div>
</form>
</body>

Le problème est que je ne voudrais pas mettre des mots tels que : Faible, moyen ou fort. Mais des images tel : pass0.jpg, pass1.jpg, pass2.jpg, pass3.jpg et pass4.jpg

Comment faire?

Merci

**Ouach** · 22/05/2007, 10h29

Tu peux ajouter une balise IMG avec l'attribut id et l'attribut src à la place de chaque entrée li (Faible, Moyen et Fort). Ensuite dans ton script tu peux faire par exemple (je n'ai pas testé)

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

document.getElementById("idDeLImage").src="pass0.jpg";

C'est à dire réassigner une nouvelle image à ta balise.

**SpaceFrog** · 22/05/2007, 10h29

mets les images dans les li ???

pas très orhtodoxe mais modification à moindre frais ...

**kevinf** · 22/05/2007, 10h37

En fait, ce que je voudrais c'est que au départ, il n'y ai rien qui s'affiche.
Ensuite, au lieu que "faible" devienne rouge, et bien ce soit cette image qui apparaisse : pass0.jpg.
Et ensuite, l'image pass0.jpg disparrait et une autre apparait : pass1.jpg et ainsi de suite jusqu'a : pass4.jpg

Merci de votre aide.

**SpaceFrog** · 22/05/2007, 10h42

au lieu de changer le color, tu changes le style.visibility ou le style.display

**kevinf** · 22/05/2007, 10h44

Pourrait tu me montrer avec le code?

Merci d'avance de ton aide.

**SpaceFrog** · 22/05/2007, 10h49

dix balles, un mars, le beurre l'argent du beurre et la main de la crèmière pour ne pas citer une autre partie plus charnue de son anatomie ????

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
6
7
 
if (cmpx == 0)
	{
		document.getElementById("weak").className = "nrm";
		document.getElementById("medium").className = "nrm";
		document.getElementById("strong").className = "nrm";
	}

modifies les class

un class avec display:none
l'autre avec display:block

Code de puissance de mot de passe

JavaScript

Vue hybride

Discussions similaires

Partager

Partager