J'ai réussi à choper un code qui fait PRESQUE pareil sauf que lui il le fait a l'inverse quand on clique sur le lien c'est une fenêtre transparente qui s'ouvre avec 100% d'opacité
Voici le code:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<title>test login sur div</title>
<script language="javascript">
<!--
var state = 'none';
function showhide(layer_ref) {
if (state == 'block') {
state = 'none';
}
else {
state = 'block';
}
if (document.all) { //IS IE 4 or 5 (or 6 beta)
eval( "document.all." + layer_ref + ".style.display = state");
}
if (document.layers) { //IS NETSCAPE 4 or below
document.layers[layer_ref].display = state;
}
if (document.getElementById &&!document.all) {
hza = document.getElementById(layer_ref);
hza.style.display = state;
}
}
//-->
</script>
<style type="text/css">
body
{
background-color: white;
font-family: Verdana;
font-size: 12px;
color:#000000;
margin:0px;
text-align : center;
}
.page
{
position : relative;
width :813px;
height : 400px;
margin: 20px auto;
text-align: center;
display: none;
}
.logbox
{
background-color: silver;
width: 100%;
height: 100%;
filter: Alpha(opacity=20);
-moz-opacity: .20;
-khtml-opacity: 0.20;
opacity: .20;
}
.logheader
{
visibility : hidden
position : relative;
width :200px;
height : 15px;
margin: auto auto;
text-align: center;
background-color:#003366;
color:#FFFFFF;
}
</style>
</head>
<body onload="showhide('backform');">
<p><a href="#" onclick="showhide('DivNews1');">Show/hide me</a></p>
<DIV class='page' id='DivNews1'>
<DIV class='logbox' id='backform' ><p>ceci est le fond</p><p>et doit etre transparent</p>
<DIV class='logheader' id='frm1' ><p>Ici tu developpe ton form en parametrant mieux le css tu n'auras aucuns mal</p></DIV></DIV>
</DIV>
</body>
</html>
Testez ce code vous verrez un lien "
Show/hide me" cliquez dessus, puis vous verrez une fenetre grise une peut transparente avec un opacité de .20
Moi enfaite moi, je voudrai faire le contraire, quand on clique sur le lien le site (la parti blanche) devienne transparente (elle blanchi) puis un formulaire de connexion s'ouvre au centre avec une opacité à 100%
Si vous avez pas compris allez sur www.tomsguide.com puis cliquez sur "
Se Connecter" vous verrez que le site ce blanchi puis ouvre un formulaire. C'est exactement ce genre de style que je voudrai faire