PHPfrance

la communauté d'entraide francophone dédiée au PHP

Zoom image lors du click

Répondre


Cette question est un moyen d’empêcher des soumissions automatisées de formulaires par des robots.
Smileys
:D :) :( :o :shock: :? 8-) :lol: :x :P :oops: :cry: :evil: :twisted: :roll: :wink: :!: :?: :idea: :arrow: :| :mrgreen: =D> #-o =P~ :^o :non: :priere: 8-|
Voir plus de smileys
  Revue du sujet
 

  Étendre la vue Revue du sujet : Zoom image lors du click

par Truc » 16 nov. 2008, 02:18

Modération :
sasuuke, si ta question est résolue, pense à ajouter le tag [Résolu]
pour indiquer aux personnes qui voudront consulter ce sujet qu'il contient une solution.
Tu peux réaliser cette opération en cliquant sur le bouton Image en haut à gauche de ce sujet.

par sasuuke » 15 nov. 2008, 22:32

ok merci

par charabia » 15 nov. 2008, 22:07

C'est \' et non /'

Il s'agit du caractère d'échappement : http://www.phpfrance.com/tutoriaux/inde ... gic-quotes

par sasuuke » 15 nov. 2008, 21:55

pk as tu utilisé le /' /' à la place " "?

par charabia » 15 nov. 2008, 21:19 

echo '<img src="Image/'.$val['id'].'.jpg" width="233" height="200" onclick="document.getElementById(\'fenetre\').style.visibility=\'visible\'"; /> 
	<div style="top:20%;left:50%; width:400px; height:100px; visibility:hidden;" id="fenetre">
	<img src="Image/'.$val['id'].'.jpg" width="553" height="800" alt="" />   
	</div>';

par sasuuke » 15 nov. 2008, 19:19 

echo '

   <img src="Image/'.$val['id'].'.jpg" width="233" height="200"  onclick="document.getElementById("fenetre").style.visibility="visible""; />
   
   <div style= " top:20%;left:50%; width:400px; height:100px;  visibility:hidden;" id="fenetre">

   <img src="Image/'.$val['id'].'.jpg" width="553" height="800" alt=""  />  
    </div>
   
   ';
il n'ya pas d'erreur mais j'ai le div qui est affiché alors qu'il est censé être caché?

par charabia » 15 nov. 2008, 16:00

tu parles des quotes simple au niveau de visible?
oui

par sasuuke » 15 nov. 2008, 14:25

tu parles des quotes simple au niveau de visible?

par charabia » 14 nov. 2008, 10:27

1. Tu as des quotes simples imbriquées d'où l'erreur.

2. Le "C" de onClick doit être en minuscule pour respecter la norme.

3. getElementById('fenetre') c'est mieux.

4. tu peux mettre le bloc DIV sous la vignette. Le style jouera son rôle.
> http://forum.alsacreations.com/faq/faq- ... ment-.html
> http://css.alsacreations.com/Faire-une- ... web-en-CSS
Des pistes pour centrer horizontalement et verticalement ton zoom.

Au lieu de mettre le style en "dur" fait une classe dans ta feuille de style, c'est plus propre.

Zoom image lors du click

par sasuuke » 14 nov. 2008, 00:04

Bonjour à tous,

J'ai crée un tableau en php pour afficher des images à partir des données de la base de données. Cependant, j'aimerais faire un zoom lorsque l'utilisateur clique sur l'image miniature. On verra apparaitre un gros bloc transparent avec au milieu l'image zoomé.

voilà mon code PHP


$NbrCol = 4;
// requete
$table = 'voitures';
$condition = ' WHERE DONNEE LIKE \'b%\' ORDER BY DONNEE ASC';
$query = 'SELECT * FROM '.$table;


$result = mysql_query($query);

// -------------------------------------------------------
$NbreData = mysql_num_rows($result);
// -------------------------------------------------------
// affichage
$NbrLigne = 0;
if ($NbreData != 0) {
$j = 1;
echo '<table border="1">';
while ($val = mysql_fetch_array($result)) {
   if ($j%$NbrCol == 1) {
      $NbrLigne++;
      echo "<tr>";
      $fintr = 0;
   }
   echo '<td>';
    // ------------------------------------------
    // AFFICHAGE des DONNEES de la fiche
   echo $val['marque'];
    echo '<br>';
   echo '

   <img src="Image/'.$val['id'].'.jpg" width="233" height="200" alt=""  onClick="document.getElementById['fenetre'].style.visibility='visible'"/>';   
   
   
   echo '<br>';
   echo '<i>'.$val['prix'].'€</i>';
    // ------------------------------------------
   echo '</td>';
   if ($j%$NbrCol == 0) {
      echo "</tr>"; 
      $fintr = 1;
   }
   $j++;

}
if ($fintr!=1) { echo '</tr>'; }
echo '</table>';
} else {
echo 'pas de données à afficher';
}

?>



</body></html>
<?php
// deconnexion de la base
mysql_close(); 
?>
Le code ci dessu m'affiche une erreur à la ligne de l'affichage des images pour le javascript.

ce code je ne sais pas où le mettre 
<div style= " top:20%;left:50%; width:400px; height:100px;  visibility:hidden;" id="fenetre">

   <img src="Image/'.$val['id'].'.jpg" width="553" height="800" alt=""  />  
    </div>';