html / javascript / onclick

html / javascript / onclick - HTML/CSS - Programmation

Marsh Posté le 22-10-2009 à 17:21:46    

Bonjour à tous,
 
Je viens de créer un site avec un formulaire, il y a un lien qui ouvre un popup qui affiche une banque d'images.
Cette banque d'image s'affiche avec des boutons radio juste en dessous pour la sélection unique.
 
<table>
  <tr>
    <td><img src=miniature1.jpg><br><input type="radio" name="user" value="photo1"></td>
    <td><img src=miniature2.jpg><br><input type="radio" name="user" value="photo2"></td>
    <td><img src=miniature3.jpg><br><input type="radio" name="user" value="photo3"></td>
  </tr>
  <tr>
    <td><img src=miniature1.jpg><br><input type="radio" name="user" value="photo4"></td>
    <td><img src=miniature2.jpg><br><input type="radio" name="user" value="photo5"></td>
    <td><img src=miniature3.jpg><br><input type="radio" name="user" value="photo6"></td>
  </tr>
</table>
 
Je souhaiterais que lorsque je clic sur le bouton radio, le popup ce ferme et colle dans mon formulaire une valeur exemple:
 
<photo>photo1</photo>
 
Bien à vous.
 

Reply

Marsh Posté le 22-10-2009 à 17:21:46   

Reply

Marsh Posté le 24-10-2009 à 15:21:41    

Hello,
j'essaierais qqch du style :
 

Code :
  1. <input type="radio" name="user" value="photo3" onclick="Selectionner(this.value);">


 
et dans ton fichier JS, tu déclares ta fonction :
 

Code :
  1. function Selectionner(val)
  2. {
  3.    //on remplit le formulaire de la page parente
  4.    window.opener.getelementById('id_du_champ_form').value = '<photo>photo' + val + '</photo>';
  6.    // on ferme cette popup
  7.    window.close();
  8. }


faut juste voir si le getElementbyId s'appliquera bien dans la fenêtre parente ...


Message édité par NewsletTux le 24-10-2009 à 15:22:12

---------------
NewsletTux - outil de mailing list en PHP MySQL
Reply

Marsh Posté le 02-11-2009 à 14:41:19    

Bonjour,
j 'aimerais center ma page web, j ai tt essayé:
les truc comme width:100%, margin:auto, mais il faut bien mettre tt ca dans #body ou ds les <div>??
Merci d'avance

Reply

Marsh Posté le 02-11-2009 à 16:57:34    

et si tu créais un autre topic ?
Et si tu faisais un effort pour filer ton code HTML et ton code CSS
 
donc tu créés un nouveau topic et tu poste ton code :o


---------------
Blablaté par Harko
Reply

Marsh Posté le 03-11-2009 à 10:49:51    

Désolé!
Voic mon code
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
<title>Untitled Document</title>
<style type="text/css">
<!--
#menu2 {
 position:absolute;
 left:467px;
 top:225px;
 width:285px;
 height:28px;
 z-index:15;
 font-family: Verdana, Arial, Helvetica, sans-serif;
 font-weight: normal;
 color: #000000;
 font-size: 16px;
 border-right-width: 1px;
 border-right-style: solid;
 border-right-color: #000000;
}
#menu3 {
 position:absolute;
 left:754px;
 top:225px;
 width:233px;
 height:27px;
 z-index:16;
 font-family: Verdana, Arial, Helvetica, sans-serif;
 font-weight: normal;
 color: #FFFFFF;
 font-size: 16px;
 border-bottom-color: #FFFFFF;
 border-right-width: 1px;
 border-right-style: solid;
 border-right-color: #000000;
}
 
#banniere {
    width:100%;
 position:absolute;
 left:195px;
 top:-1px;
 width:1019px;
 margin:0 auto 0 auto;
 height:194px;
 z-index:16;
 background-color: #FFFFFF;
}
#menu4 {
 position:absolute;
 left:989px;
 top:225px;
 width:260px;
 height:27px;
 z-index:6;
 font-family: Verdana, Arial, Helvetica, sans-serif;
 font-weight: normal;
 color: #FFFFFF;
 font-size: 16px;
 border-right-width: 0px;
 border-right-style: solid;
 border-right-color: #000000;
}
#menu1 {
 position:absolute;
 left:198px;
 top:225px;
 width:267px;
 height:27px;
 z-index:7;
 font-family: Verdana, Arial, Helvetica, sans-serif;
 font-weight: normal;
 color: #000000;
 font-size: 16px;
 border-right-width: 1px;
 border-right-style: solid;
 border-right-color: #000000;
}
a:link {
 color: #000000;
 text-decoration: none;
}
a:visited {
 text-decoration: none;
 color: #000000;
}
a:hover {
 text-decoration: none;
 color: #FFFFFF;
}
a:active {
 text-decoration: none;
 color: #000000;
}
body {  
    position:absolute;
    width:600px;
 margin-left:auto;
    margin-right:auto;
 text-align:center;
 background-image: url();
 background-repeat: no-repeat;
}
#real {
 position:absolute;
 left:399px;
 top:305px;
 width:661px;
 height:81px;
 z-index:8;
 font-family: Verdana, Arial, Helvetica, sans-serif;
 font-size: 16px;
 line-height: normal;
 color: #000000;
}
#bandeau {
 position:absolute;
 left:195px;
 top:198px;
 width:308px;
 height:570px;
 z-index:2;
 background-color: #D2D3FB;
}
#sarl {
 position:absolute;
 left:551px;
 top:719px;
 width:644px;
 height:142px;
 z-index:9;
 font-family: Verdana, Arial, Helvetica, sans-serif;
 font-size: 14px;
}
#Layer3 {
 position:absolute;
 left:0px;
 top:0px;
 width:739px;
 height:404px;
 z-index:10;
}
#Layer1 {
 position:absolute;
 left:574px;
 top:600px;
 width:104px;
 height:124px;
 z-index:10;
}
#gerant {
 position:absolute;
 left:575px;
 top:574px;
 width:137px;
 height:25px;
 z-index:11;
 font-family: Verdana, Arial, Helvetica, sans-serif;
 font-size: 14px;
}
#Layer2 {
 position:absolute;
 left:748px;
 top:601px;
 width:124px;
 height:137px;
 z-index:12;
}
#resp {
 position:absolute;
 left:733px;
 top:574px;
 width:165px;
 height:26px;
 z-index:13;
 font-family: Verdana, Arial, Helvetica, sans-serif;
 font-size: 14px;
}
#Layer5 {
 position:absolute;
 left:801px;
 top:521px;
 width:379px;
 height:391px;
 z-index:14;
}
#Layer6 {
 position:absolute;
 left:449px;
 top:189px;
 width:855px;
 height:759px;
 z-index:1;
 background-color: #FFFFFF;
}
.style3 {
 color: #000000;
 font-weight: bold;
}
.style5 {
 font-size: 16;
 font-weight: bold;
}
#resume {
 position:absolute;
 left:392px;
 top:439px;
 width:699px;
 height:107px;
 z-index:14;
 font-family: Verdana, Arial, Helvetica, sans-serif;
 font-size: 14px;
}
#Layer4 {
 position:absolute;
 left:504px;
 top:804px;
 width:740px;
 height:117px;
 z-index:15;
}
#Layer7 {
 position:absolute;
 left:550px;
 top:737px;
 width:580px;
 height:79px;
 z-index:15;
}
#Layer8 {
 position:absolute;
 left:195px;
 top:194px;
 width:1058px;
 height:557px;
 z-index:2;
}
#Layer9 {
 position:absolute;
 left:0px;
 top:0px;
 width:154px;
 height:79px;
 z-index:15;
}
#Layer10 {
 position:absolute;
 left:194px;
 top:168px;
 width:1054px;
 height:600px;
 z-index:15;
}
#Layer11 {
 position:absolute;
 left:577px;
 top:64px;
 width:283px;
 height:130px;
 z-index:17;
 font-family: Arial, Helvetica, sans-serif;
 font-size: 36px;
-->
</style>
</head>
 
<body>
<center>
<div id="menu2">
  <p align="center"><a href="service.html" class="style3"> SERVICES ET PRODUITS </a></p>
</div>
<div id="menu3">
  <p align="center"><a href="fournisseur.html"><strong> FOURNISSEURS </strong></a></p>
</div>
<div id="banniere"><img src="images/banniere.jpg" width="1056" height="202" longdesc="images/Sans titre-1.jpg" /></div>
<div id="menu4">
  <p align="center"><a href="contact.html"><strong>CONTACT</strong></a></p>
</div>
<div id="menu1">
  <div align="center" class="style5">PRESENTATION</div>
</div>
<div id="real">  
  <p align="center" class="style5">R&eacute;alisation des  travaux sans interm&eacute;diaire, ni sous-traitance.</p>
  <p align="center"><strong>Une entreprise de fourniture et pose de fen&ecirc;tres, portes, volets, enti&egrave;rement responsable &agrave; &eacute;chelle humaine . </strong></p>
  <p align="left">&nbsp;</p>
</div>
<div id="Layer1"><img src="images/andre copie.jpg" width="137" height="140" longdesc="images/andre copie.jpg" /></div>
<div id="gerant">
  <div align="center">G&eacute;rant</div>
</div>
<div id="Layer2"><img src="images/patrick copie.jpg" width="134" height="138" longdesc="images/patrick copie.jpg" /></div>
<div id="resp">
  <div align="center">Responsable du SAV </div>
</div>
<div id="resume">
  <div align="justify">
    <p align="justify">Apr&egrave;s un CAP de serrurier, une sp&eacute;cialisation dans la pose des fen&ecirc;tres et la miroiterie, &agrave; suivi une longue p&eacute;riode en qualit&eacute; de contr&ocirc;leur de travaux.Lors de la cr&eacute;ation de notre soci&egrave;t&eacute;, dans un premier temps nous avons travaill&eacute; en sous-traitance pour de grandes enseignes de fabricant de fen&ecirc;tres. Aujourd'hui notre soci&egrave;t&eacute; poss&egrave;de une solide exp&eacute;rience qui nous permet de vous proposer la fourniture et la pose de fen&ecirc;tres, de portes, de volets roulants et autres produits de fabrication fran&ccedil;aise. </p>
  </div>
</div>
<div id="Layer8"><img src="images/fenetre-2 copie copie.jpg" width="1056" height="556" lowsrc="images/fenetre-2 copie copie.jpg" longdesc="images/fenetre-2 copie copie.jpg" /></div>
<p>&nbsp;</p>
</center>
</body>
</html>

Reply

Marsh Posté le 03-11-2009 à 14:13:27    

arf tout est en absolute

Reply

Marsh Posté le 03-11-2009 à 15:45:43    

C'est à dire?
Je dois tout mettre relative?

Reply

Marsh Posté le 03-11-2009 à 15:58:53    

oui

Reply

Marsh Posté le 03-11-2009 à 16:03:34    

Mais ça me décale tout :(
Je refait le site pour ne pas faire d'erreur, si je fais:
#Layer1 {
 margin:auto;
 width:800px;
 height:94px;
 z-index:1;
mon site sera centré c'est bon??
Merci

Reply

Marsh Posté le 03-11-2009 à 16:28:43    

lolz

Reply

Marsh Posté le 03-11-2009 à 16:28:43   

Reply

Marsh Posté le 03-11-2009 à 17:10:05    

pour centrer ta div tu fais

 

#layer1{
 margin:0 auto;
}


Message édité par stealth35 le 03-11-2009 à 17:10:28
Reply

Marsh Posté le 03-11-2009 à 17:14:24    

Je te remercie:)

Reply

Marsh Posté le 03-11-2009 à 17:43:20    

Re bonjour,
alors j'ai fait margin:0
ca centre bien pour un calque, mais quand je met d'autre calques par dessus ca ne va pas les calques ne se chevauchent plus!
A l'aide
merciiiii

Reply

Marsh Posté le 03-11-2009 à 18:05:51    

Sérieux cherche des tuto, y'en a plein sur ça

Reply

Marsh Posté le 03-11-2009 à 18:21:02    

ok

Reply

Sujets relatifs:

Leave a Replay

Make sure you enter the(*)required information where indicate.HTML code is not allowed