Bonjour à tous,
J'imagine que mon problème doit être facilement réglable, mais j'y suis depuis hier soir et je n'arrive pas à trouver la bonne solution.
J'ai une banderole, avec en bas à gauche un coins mail et en bas à droite un coins information. Si je clique sur la partie information, un toggle se met en route, et laisse apparaitre le texte. Je voudrais qu'il prenne la partie droite de la banderole, mais il prend malheureusement toute la partie basse de l'image, de gauche à droite, empiétant donc sur le coins mail et se superposant de façon moche à lui.
Voici mon code :
Et le code jquery (tout simple)
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 <div id="bloc_galerie_illustration"> <div style="background: url(../images/marques.jpg);position:absolute;width:740px; height:220px; background-repeat:no-repeat;"> <div style="position:absolute;left:0px;bottom:0px;;border-style:solid;" class="AlerteMail"> <div id="ContactSouscription"> <div id="ContactForm" style="position: absolute;left:0;bottom:0;display:none"> <fieldset> <label for="Nom">Nom</label> <input id="Nom" type="text" /><br> <label for="Email">Adresse E-mail</label> <input id="Email" type="text" /><br> <input id="EnvoiMail" type="submit" name="submit" onclick="closeForm()" /><br> <span id="MessageEnvoi">Vous recevrez désormais toutes <br> les informations concernant ' .$nom_com_marque. ' !</span> </fieldset> </div> <div id="ContactFautPasRater" style ="color:white;filter:alpha(opacity=50);-moz-opacity:0.5;opacity:0.5;background-color:black;">Ne ratez pas les prochaines <br>nouveautés ' .$nom_com_marque. '</div> <div id="ContactLien" style="color:white;filter:alpha(opacity=70);-moz-opacity:0.7;opacity:0.7;background-color:black;"> Souscrivez à l\'alerte e-mail </div> </div> </div> <div style="position:absolute;right:0px;bottom:0px;border-style:solid;" class="DecouvrirStyle"> <div id="DecouvrirStyle" style="rigth:0;bottom:0;display:none;color:white; filter:alpha(opacity=50);-moz-opacity:0.5;opacity: 0.5;background-color:black;"> ' .$com_marque. ' </div> <div id="DecouvrirLien" style="color:white;filter:alpha(opacity=70);-moz-opacity:0.7;opacity:0.7;background-color:black;">Découvrez le style ' .$nom_com_marque. '</div> </div> </div> </div>';
Je ne sais pas si j'ai été très clair... Si besoin je préciserai ^^.
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 $(document).ready( function() { $('#ContactLien').click(function() { if ($('#ContactForm').is(':hidden')) { $('#ContactForm').toggle('slow'); $('#ContactFautPasRater').toggle('slow'); } else { $('#ContactForm').toggle('slow'); $('#ContactFautPasRater').toggle('slow'); } }); $('#DecouvrirLien').click(function() { if ($('#DecouvrirStyle').is(':hidden')) { $('#DecouvrirStyle').toggle('slow'); } else { $('#DecouvrirStyle').toggle('slow'); } }); });
En vous remerciant !
Partager