Voilà j'ai résumé mon 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" xml:lang="en" lang="fr">
<head>
<meta http-equiv="content-type" content="text/html; charset=utf-8" />
<script language="JavaScript" type="text/javascript"></script>
<style type="text/css">
.formulaire
{
position:absolute;
z-index:40;
margin-top:175px;
margin-left:400px;
width: 463px;
top:100px;
}
#bande-dessus
{
background:url(images/decoupe/commentaire-haut.png) no-repeat;
width: 440px;
height: 23px;
float:left;
}
#bande-dessous
{
background:url(images/decoupe/commentaire-bas.png) no-repeat;
width: 463px;
height: 13px;
}
#ferme
{
background:url(images/decoupe/croix-ferme.png) no-repeat;
width: 23px;
height: 23px;
float:left;
}
form{
border:none;
top:0px;
font-family:Arial, sans-serif;
font-size:13px;
color:#A09A84;
margin-left:25px;
letter-spacing:2px;
}
#cadre
{
background:url(images/decoupe/commentaire-tranche.png) repeat;
width:463px;
border:none;
margin-top:23px;
}
#envoyer
{
background:url(images/decoupe/bouton-envoyer.png) no-repeat center;
width: 83px;
height: 14px;
margin-left:172px;
margin-top: 10px;
}
#newsletter {
background:url(images/decoupe/post-it.png) no-repeat top right;
width:130px;
height:116px;
margin-left:15px;
}
</style>
</head>
<script type="text/javascript">
//<![CDATA[
function valider() {
// Initialisation variable error
$error = false;
$alert = "";
if(document.formSaisie.nom.value == "") {
// sinon on affiche un message
$alert += "Saisissez le Nom et Prénom\n";
// et on indique de ne pas envoyer le formulaire
$error = true;
}
// si la valeur du champ prenom est non vide
if(document.formSaisie.adresse.value == "") {
// sinon on affiche un message
$alert += "Saisissez l'adresse email\n";
// et on indique de ne pas envoyer le formulaire
$error = true;
}
if ($error) {
// = TRUE Il y a des erreurs
alert ($alert);
return false;
} else {
// = FALSE pas d'erruer
alert ("Merci!");
return true;
}
}
//]]>
</script>
<body>
<div class="formulaire" style="display:block">
<div id="bande-dessus"></div>
<div id="ferme"></div>
<div id="cadre">
<form action="traitement.php" onsubmit="return valider()" method="post" name="formSaisie">
NOM / PRENOM: <input type="text" name="nom" id="nom" size="42"><br>
Message (facultatif mais bienvenu!): <br><textarea name="commentaire" id="commentaire" rows="7" cols="49"></textarea><br>
Email (si vous souhaitez recevoir la newsletter): <input type="text" name="adresse" id="adresse" size="64"><br>
<button id="envoyer" type="submit" value="Ok">
</form></div>
<div id="bande-dessous"></div>
</div>
<div id="newsletter"></div>
</body>
</html>
Je voudrais donc que lorsque l'on clique sur le div newsletter, cela fasse apparaître le div formulaire et que lorsque l'on clique sur le div ferme qui est dans le div formulaire, le div formulaire se cache. Et j'aimerais aussi que lorsque l'on clique sur le bouton submit (là il y aura un alert "Merci" si tout est correctement rempli) et ensuite lorsque l'on clique sur le "ok" de cet alert le div formulaire disparaisse aussi du coup! Et encore une petite question (je suis très nulle! en fait plus douée pour ce qui est apparence html et css) le bouton submit on doit l'envoyer vers quoi?
J'espère que c'est +/- compréhensible :) Et merci beaucoup de bien vouloir m'accorder du temps!