Mettre mes images l'une à cote de l'autre

Résolu

Utilisateur anonyme -
AssassinTourist Messages postés 6029 Date d'inscription Statut Contributeur Dernière intervention - 5 mars 2012 à 13:30

Bonjour,

j'aimerai savoir comment mettre mes images l'une a cote de l'autre (par ligne de 4 photos).
Je n'y arrive pas , elles s'affichent l'une en desous de l'autre.

ma ligne de code :

<?php do { ?>
<a href="OnlyFileADULTE_sur_CDROM.php?NUM=<?php echo $row_FILMS_ADULTE_sur_CDROM['NUM']; ?>">
<td><img src="\..\..\VALM\images\ADULTES\Adultes Sur CDROM\<?php echo $row_FILMS_ADULTE_sur_CDROM['PICTURENAME']; ?>" width="200" height="300" /></td></br>
<div align="center"><span class="Style4"><?php echo $row_FILMS_ADULTE_sur_CDROM['ORIGINALTITLE']; ?></span></div>
<br />
<?php } while ($row_FILMS_ADULTE_sur_CDROM = mysql_fetch_assoc($FILMS_ADULTE_sur_CDROM)); ?>

Qui à la solution ?

merci à tous ceux qui m'aident.

Afficher la suite

A voir également:

Mettre mes images l'une à cote de l'autre
Des images - Guide
Point vert a cote de la batterie - Accueil - Protection
Pourquoi mon casque bluetooth ne marche que d'un coté ✓ - Forum Casque et écouteurs
Frédéric cherche à faire le buzz sur les réseaux sociaux. il a ajouté une image de manchots sur une image de plage. retrouvez l'image originale de la plage. que cachent les manchots ? - Forum Graphisme
Configuration cote à cote incorrecte chrome ✓ - Forum Google Chrome

16 réponses

Réponse 1 / 16

tomyboy97 Messages postés 144 Date d'inscription Statut Membre Dernière intervention 7

Je ne comprends pas trop ta question, veut tu parler de dans une dossier ou quoi ?...

Réponse 2 / 16

Utilisateur anonyme

Il y a du code php (que j'ai donné). Les images s'affichent mais pas comme je le desirerai. C'est à dire 4 photos par ligne qui devrainent se mettre l'une à de cote de l'autre.

Réponse 3 / 16

#4bd0ul-m0um1n3# Messages postés 96 Date d'inscription Statut Membre Dernière intervention 3

il faut faire des <img /> <img />
mettre les balises les unes après les autres.

Réponse 4 / 16

Utilisateur anonyme

vous ne savez pas lire ?

Vous n’avez pas trouvé la réponse que vous recherchez ?

Posez votre question

Réponse 5 / 16

AssassinTourist Messages postés 6029 Date d'inscription Statut Contributeur Dernière intervention 1 312

Bonjour,

Votre construction html ne va pas du tout pour un tableau.

En simplifiant votre code :

<table> 
  <tr> 
    do{ 
      <td> 
        <a href=""><img /></a> 
        <div>ORIGINALITE</div> 
      </td> 
    } 
  </tr> 
</table>

Pas de br qui se balade, le div suffit à le faire aller à la ligne. On met tout dans la case, proprement. Et ça ne sert à rien d'avoir un div et un span imbriqué comme ça. Vous pouvez faire <div align="center" class="Style4">

Avec ça, vous n'aurez qu'une ligne, hein...

Réponse 6 / 16

Utilisateur anonyme

j'ai tout esssayé...enlevé les div,les remettre,les deplacer...et les autres (br,td...etc...etc...)

je remets mon code (php - avec dreamweaver 8) :

<form id="form2" name="form2" method="post" action="">
<div align="center">

<?php do { ?>

<a href="OnlyFileADULTE_sur_CDROM.php?NUM=<?php echo $row_FILMS_ADULTE_sur_CDROM['NUM']; ?>">
<img src="\..\..\VALM\images\ADULTES\Adultes Sur CDROM\<?php echo $row_FILMS_ADULTE_sur_CDROM['PICTURENAME']; ?>" width="200" height="300" />
<div align="center"><span class="Style4"><?php echo $row_FILMS_ADULTE_sur_CDROM['ORIGINALTITLE']; ?></span></div></a>

<?php } while ($row_FILMS_ADULTE_sur_CDROM = mysql_fetch_assoc($FILMS_ADULTE_sur_CDROM)); ?></a>

</form>

les images s'affichent toujours l'une en desous de l'autre.....

Réponse 7 / 16

AssassinTourist Messages postés 6029 Date d'inscription Statut Contributeur Dernière intervention 1 312

Plus de tableau finalement ? Bon...

Est-ce que ce code est inclus dans une div (ou autre) qui aurait une width quelconque ? Vos images rentrent-t-elles bien dans la page en largeur par rapport à la taille de fenêtre de votre navigateur ?

PS : Mettre <a href=""><div></div></a> caylemal !!!!!!!
=> <div><a href=""></a></div>

Réponse 8 / 16

Utilisateur anonyme

1) le code n'est pas dans une div et il n'y a pas de width
2) mes images rentrent bien dans la largeur par rapport à la taille de fenetre de mon navigateur

Malgre votre bon vouloir , lorsque je fais ceci , mes images s'affichent toujours l'une en desous de l'autre :

<form id="form2" name="form2" method="post" action="">
<div align="center">

<?php do { ?>

<div><a href="OnlyFileADULTE_sur_CDROM.php?NUM=<?php echo $row_FILMS_ADULTE_sur_CDROM['NUM']; ?>">
<img src="\..\..\VALM\images\ADULTES\Adultes Sur CDROM\<?php echo $row_FILMS_ADULTE_sur_CDROM['PICTURENAME']; ?>" width="200" height="300" />
<div align="center"><span class="Style4"><?php echo $row_FILMS_ADULTE_sur_CDROM['ORIGINALTITLE']; ?></span></div></a></div>

<?php } while ($row_FILMS_ADULTE_sur_CDROM = mysql_fetch_assoc($FILMS_ADULTE_sur_CDROM)); ?></a>

AssassinTourist Messages postés 6029 Date d'inscription Statut Contributeur Dernière intervention 1 312

Ah mais oui, suis-je bête. Enlève tes div. Sinon il fallait faire un tableau.

Utilisateur anonyme

j'ai enleve mes div (voir le code ci-dessous) :

<form id="form2" name="form2" method="post" action="">
<div align="center">

<?php do { ?>

<a href="OnlyFileADULTE_sur_CDROM.php?NUM=<?php echo $row_FILMS_ADULTE_sur_CDROM['NUM']; ?>">
<img src="\..\..\VALM\images\ADULTES\Adultes Sur CDROM\<?php echo $row_FILMS_ADULTE_sur_CDROM['PICTURENAME']; ?>" width="200" height="300" />
<div align="center"><span class="Style4"><?php echo $row_FILMS_ADULTE_sur_CDROM['ORIGINALTITLE']; ?></span></div></a>

<?php } while ($row_FILMS_ADULTE_sur_CDROM = mysql_fetch_assoc($FILMS_ADULTE_sur_CDROM)); ?>

les images s'affichent toujours l'une en desous de l'autre.....

AssassinTourist Messages postés 6029 Date d'inscription Statut Contributeur Dernière intervention 1 312

Tu as celui-là qui a trainé <div align="center"> pour ton ORIGINALITE

Utilisateur anonyme

donc j'ai bien enleve le div de ORIGINALTITLE , qui est devenu :

<span class="Style4"><?php echo $row_FILMS_ADULTE_sur_CDROM['ORIGINALTITLE']; ?></span></a>

mais je suis toujours embete, au lieu de 4 photos j'en ai 3 sur une ligne . Ce qui est different, c'est que le titre de chaque image est à cote de l'image en question. alors comment faire pour que mes titres d'image soit en dessous de chaque image ?

Réponse 9 / 16

AssassinTourist Messages postés 6029 Date d'inscription Statut Contributeur Dernière intervention 1 312

Si tu n'as que 3 photos, ça doit dire que ton do while ne te renvoie que trois résultats.

Pour mettre originalité à la ligne, mets un <br /> avant.

Sachant quand même que la solution la plus propre reste un tableau, mais bon...

Réponse 10 / 16

Utilisateur anonyme

j'ai fais 2 tentavtives :

1) En mettant </br> pour que l'originalite se mettent à la ligne

2) En mettant <br/> pour que l'originalite se mettent à la ligne

dans les 2 cas , ca fonctionne pas

AssassinTourist Messages postés 6029 Date d'inscription Statut Contributeur Dernière intervention 1 312

</br> ne fonctionnera jamais hein...
Sinon est-ce qu'on peut voir le site en ligne ?

Utilisateur anonyme

desole, c'est un site personnel.....

Connais tu DynDNS ?

AssassinTourist Messages postés 6029 Date d'inscription Statut Contributeur Dernière intervention 1 312

Non.
Mais en fait, j'ai testé le code avec le tableau chez moi et ça marche.

<table> 
  <tr> 
    do{ 
      <td> 
        <a href=""><img /></a> 
        <div>ORIGINALITE</div> 
      </td> 
    } 
  </tr> 
</table>

Sans autres div !! Tu remplis juste les balises que j'ai mis (sans rajouter tes class, on va voir petit à petit)

Utilisateur anonyme

voila c'est fais.....tu me proposes donc autre chose, non ?

AssassinTourist Messages postés 6029 Date d'inscription Statut Contributeur Dernière intervention 1 312

Pas vraiment, c'est ton code de départ (avec un tableau) mais corrigé. Mais tu m'as dit que ça ne marchait pas, alors moi j'aimerai bien voir ton code quand tu avais testé cette solution.

Réponse 11 / 16

AssassinTourist Messages postés 6029 Date d'inscription Statut Contributeur Dernière intervention 1 312

Ca n'a aucun rapport. Le tableau, c'est pour l'aspect visuel. Le formulaire, c'est pour passer des informations d'une page à une autre.

Qu'est-ce que tu cherches à faire en fait ?

Réponse 12 / 16

Utilisateur anonyme

mettre mes images (avec leur lien respectif) et mettre le nom de l'image en dessous de l'image, voila ce que je cherchais à faire

AssassinTourist Messages postés 6029 Date d'inscription Statut Contributeur Dernière intervention 1 312

Mets-moi ton code avec ton tableau.

Utilisateur anonyme

<body>
<div align="center">
<a href="OnlyFILE<?php echo $row_jeux_xxx_sur_cdrom['NUM']; ?>">
<?php do { ?>
<img src="<?php echo $row_jeux_xxx_sur_cdrom['PICTURENAME']; ?>" width="200" height="300" />
<?php } while ($row_jeux_xxx_sur_cdrom = mysql_fetch_assoc($jeux_xxx_sur_cdrom)); ?>
</a><br />
<?php echo $row_jeux_xxx_sur_cdrom['ORIGINALTITLE']; ?><br />
</div>
<form id="form1" name="form1" method="post" action="">
<div align="center"></div>
</form>
</body>
</html>
<?php
mysql_free_result($jeux_xxx_sur_cdrom);
?>

AssassinTourist Messages postés 6029 Date d'inscription Statut Contributeur Dernière intervention 1 312

Dans tes balises <body>, tu mets ça :

<table> 
 <tr> 
  <?php do { ?> 
   <td> 
    <a href="OnlyFILE<?php echo $row_jeux_xxx_sur_cdrom['NUM']; ?>"><img src="<?php echo $row_jeux_xxx_sur_cdrom['PICTURENAME']; ?>" width="200" height="300" /></a><br /> 
    <?php echo $row_jeux_xxx_sur_cdrom['ORIGINALTITLE']; ?> 
   </td> 
  <?php } while ($row_jeux_xxx_sur_cdrom = mysql_fetch_assoc($jeux_xxx_sur_cdrom)); ?> 
 </tr> 
</table>

Utilisateur anonyme

j'ai encore une question....
comment faire pour que ,lorsque je "voyage" (sans faire de clique) avec ma souris sur une photo, un petit rectangle apparait (le descriptif (trest tres succint) de la photo) puis le rectangle disparait lorsque ma sousirs n'est plus sur la photo.

un exemple, en allantvoir sur ce site vous comprendrez mieux (c'est la 1ere page) :
http://www.etam.com/pret-a-porter/manteaux-vestes.html

allez voir la toute premiere photo que vous voyez, vous verrez ceci : Veste effet cuir SABBY ROUGE

Réponse 13 / 16

Utilisateur anonyme

Donc si j'ai bien compris, le code javascript "onmouseover" et "onmouseout"que tu as mis servent lors que passage de la souris sur l'image a souligné le titre de l'image et quand la souiris n'est plus sur l'image le titre n'est pas souligné ?
C'est bien cela ? J'ai bien compris ?

Ensuite ce quil se passe avec le code j'ai 1 image , puis en desous j'en ai 3 (et pourtant j'ai changé $nb_col et j'ai mis la vameur 4).d'ou voici le code :
<table>
<tr>
<div align="center"/>
<?php
$nb_col=4;
$i=0;
$dir="../../images/ADULTES/Adultes sur CDROM/";
do { ?>

<td>
<a href="OnlyFileADULTE_sur_CDROM.php?NUM=<?php echo $row_FILMS_ADULTE_sur_CDROM['NUM']; ?>">
<img src="<?php echo $dir.$row_FILMS_ADULTE_sur_CDROM['PICTURENAME'];?>" width="230" height="260"
onmouseover='document.getElementById("<?php echo $i ?>").style.textDecoration = "underline"'
onmouseout='document.getElementById("<?php echo $i ?>").style.textDecoration = "none"' /></a>

<p id="<?php echo $i ?>"><?php echo $row_FILMS_ADULTE_sur_CDROM['ORIGINALTITLE']; ?> </p>
</td>
<?php
if(!($i%$nb_col)) echo "</tr><tr>";
$i++;
} while ($row_FILMS_ADULTE_sur_CDROM = mysql_fetch_assoc($FILMS_ADULTE_sur_CDROM)); ?>
</tr>
</table>

Alors comment se fait-il que j'ai 4 images sur 2 lignes au lieu de 1 ligne ?

AssassinTourist Messages postés 6029 Date d'inscription Statut Contributeur Dernière intervention 1 312

Tu as bien compris pour le onmouseover et le onmouseout.
Euh oui, dans les exemples d'avant, je m'étais trompé et il fallait initialiser la variable $i à 1 et non à 0.

Réponse 14 / 16

Utilisateur anonyme

ca marche à merveille ! merci à toi AssassinTourist

Amitié lolo590807

AssassinTourist Messages postés 6029 Date d'inscription Statut Contributeur Dernière intervention 1 312

De rien =)

Réponse 15 / 16

AssassinTourist Messages postés 6029 Date d'inscription Statut Contributeur Dernière intervention 1 312

<table> 
 <tr> 
  <?php 
     $i=0;
     do { 
   ?> 
   <td> 
    <a href="OnlyFILE<?php echo $row_jeux_xxx_sur_cdrom['NUM']; ?>"><img src="<?php echo $row_jeux_xxx_sur_cdrom['PICTURENAME']; ?>" width="200" height="300" onmouseover="document.getElementById('<?php echo $i ?>').style = 'underline'" onmouseout="document.getElementById('<?php echo $i ?>').style = 'none'" /></a>
    <p id="<?php echo $i ?>"><?php echo $row_jeux_xxx_sur_cdrom['ORIGINALTITLE']; ?> </p>
   </td> 
  <?php 
     $i++;
     } while ($row_jeux_xxx_sur_cdrom = mysql_fetch_assoc($jeux_xxx_sur_cdrom)); 
   ?> 
 </tr> 
</table>

Utilisateur anonyme

ca me met ces erreurs là:

1ere erreur :
Notice: Undefined variable: i in C:\wamp\www\VALM\PAGES\Adulte\Films_XXX_sur_CD.php on line 73 Call Stack #TimeMemoryFunctionLocation 10.0008394552{main}( )..\Films_XXX_sur_CD.php:0 ').style = 'underline'" onmouseout="document.getElementById('

2eme erreur :
Notice: Undefined variable: i in C:\wamp\www\VALM\PAGES\Adulte\Films_XXX_sur_CD.php on line 75 Call Stack #TimeMemoryFunctionLocation 10.0008394552{main}( )..\Films_XXX_sur_CD.php:0 ">

Utilisateur anonyme

bonjour AssassinTourist,

j'ai modifié le code :

<?php
$i=0;
$dir="../../images/ADULTES/Adultes sur CDROM/";
do { ?>
<a href="OnlyFileADULTE_sur_CDROM.php?NUM=<?php echo $row_FILMS_ADULTE_sur_CDROM['NUM']; ?>">
<img src="<?php echo $dir.$row_FILMS_ADULTE_sur_CDROM['PICTURENAME'];?>" width="230" height="260"
onmouseover="document.getElementById('<?php echo $i; ?>').style = 'underline'"
onmouseout="document.getElementById('<?php echo $i; ?>').style = 'none'" />
<p id="<?php echo $i; ?>"><?php echo $FILMS_ADULTE_sur_CDROM['ORIGINALTITLE']; ?></a>
<?php
$i++;
} while ($row_FILMS_ADULTE_sur_CDROM = mysql_fetch_assoc($FILMS_ADULTE_sur_CDROM)); ?>

1) Le souci c'est que mes images apparaissent l'une en desous de l'autre.

2) Et que font "onmouseover" et "onmouseout".... ? car je ne vois rien de rien qui se passe (lorsque je survole les images)

AssassinTourist Messages postés 6029 Date d'inscription Statut Contributeur Dernière intervention 1 312

Ca va à la ligne parce que tu as enlever mon tableau v__v
Et je vois le problème qui as entraîné les erreurs, je vais te corriger ça.

Réponse 16 / 16

AssassinTourist Messages postés 6029 Date d'inscription Statut Contributeur Dernière intervention 1 312

<table>  
 <tr>  
  <?php  
     $i=0; 
     do {  
   ?>  
   <td>  
    <a href="OnlyFILE<?php echo $row_jeux_xxx_sur_cdrom['NUM']; ?>"><img src="<?php echo $row_jeux_xxx_sur_cdrom['PICTURENAME']; ?>" width="200" height="300" onmouseover='document.getElementById("<?php echo $i ?>").style.textDecoration = "underline"' onmouseout='document.getElementById("<?php echo $i ?>").style.textDecoration = "none"' /></a> 
    <p id="<?php echo $i ?>"><?php echo $row_jeux_xxx_sur_cdrom['ORIGINALTITLE']; ?> </p> 
   </td>  
  <?php  
     $i++; 
     } while ($row_jeux_xxx_sur_cdrom = mysql_fetch_assoc($jeux_xxx_sur_cdrom));  
   ?>  
 </tr>  
</table>

Utilisateur anonyme

le petit souci maintenant, c'est que au lieu d'avoir 2 lignes avec 8 images sur chaque ligne, j'ai une seule ligne avec 16 images qui sont l'une à cote de l'autre.

J'ai une question : lorsqe je survole ,les images il ne sepasse rien de rien

AssassinTourist Messages postés 6029 Date d'inscription Statut Contributeur Dernière intervention 1 312

J'ai rajouté un modulo $nb_col qui va permettre d'aller à la ligne toutes les 8 colonnes.

<table>  
 <tr>  
  <?php  
     $nb_col = 8;
     $i=1; 
     do {  
   ?>  
   <td>  
    <a href="OnlyFILE<?php echo $row_jeux_xxx_sur_cdrom['NUM']; ?>"><img src="<?php echo $row_jeux_xxx_sur_cdrom['PICTURENAME']; ?>" width="200" height="300" onmouseover='document.getElementById("<?php echo $i ?>").style.textDecoration = "underline"' onmouseout='document.getElementById("<?php echo $i ?>").style.textDecoration = "none"' /></a> 
    <p id="<?php echo $i ?>"><?php echo $row_jeux_xxx_sur_cdrom['ORIGINALTITLE']; ?> </p> 
   </td>  
  <?php  
     if(!($i%$nb_col)) echo "</tr><tr>";
     $i++; 
     } while ($row_jeux_xxx_sur_cdrom = mysql_fetch_assoc($jeux_xxx_sur_cdrom));  
   ?>  
 </tr>  
</table>

Au niveau du soulignement, j'ai testé avec Firefox, Chrome et IE...

Je te dis ce que j'ai fait : Sur l'image je lui ai rajouté du javascript. onmouseover, c'est l'action quand on passe la souris dessus, et onmouseout, c'est l'action quand on enlève sa souris. Et je lui ai dit de regarder dans le document, un élément qui a un id égal à $i. A cet élément, il va changer le style css en changeant la propriété text-decoration en underline ou none, suivant les cas. Ce qui donne :

onmouseover='document.getElementById("<?php echo $i ?>").style.textDecoration = "underline"' 
onmouseout='document.getElementById("<?php echo $i ?>").style.textDecoration = "none"'

Attention aux doubles et simples guillemets !

Sinon mets-moi ton code que tu testes

Discussions similaires

calcule nombre des pixels "noir" dans un image (noir/blanc)

PIX

Retrouver l'image originale après avoir fait des modifications ?

Comment mettre des images côte à côte?

A quoi correspond cette croix sur snapchat

Votre réponse

Discussions similaires