afficher un lien php sur une image

Version imprimable

24/04/2012, 23h51
programmatrice

afficher un lien php sur une image

salut tous!
comment afficher un lien vers une page php
dés que je mets le curseur sur une image sachant que j'ai +eurs images qui sont affichées dans une boucle! donc il fallait faire attention lorsque je clique sur une autre image le lien disparait de l'autre
A+
25/04/2012, 08h35
Nesmontou

Bonjour,

Je n'ai rien compris.

Tu pourrais montrer le code mis en place ?
25/04/2012, 08h39
Invité

Bonjour,
à priori :

Code:

<a href="<?php echo $URL_page; ?>"><img src="<?php echo $URL_image; ?>" alt="" /></a>

ou (résultat d'une requête) :

Code:

<a href="<?php echo $row['URL_page']; ?>"><img src="<?php echo $row['URL_image']; ?>" alt="" /></a>

c'est pas ça ce que je voudrais faire,
je veux afficher un lien a droite en haut dés que je mets la souris sur l'une des images!!
mes images sont tirés à partir de la base de doonnés
voici en qq sorte mon code

Code:

1
2
3
4
5
6
7
8
9
10
11
12
 if($nbP>0)
    { echo "vous avez ".$nbP." publication(s)<br>";
	include "bbcode_function.php";
	  while ($Valeur=$resultatpub->fetch())
        {$var = $Valeur['desc_Fr'];
$var2 = $Valeur['desc_En'];
$desc=bbcode($var);
$desc2=bbcode($var2);
			echo "<table>";
			$num_image=$Valeur['idpub'];
			echo '<tr><td><div><h3 id=image_'.$num_image.'><img src="../userImage/' . $Valeur['img_Pr'] . '" height=100 width=150  onmouseover="?" onmouseout="?" title="' . $Valeur['nom_Fr'] . '"></h3><h4>Produit:' . $Valeur['nom_Fr'] . ' </h4><h5>' . $Valeur['date'] .'</h5></div> </td><td> '.$desc.'<br>'.$desc2.'<br><br><br><br><br><br><br><br></td></tr></table><p id=go>--------';
echo '<div name="BaliseImg1" id="BaliseImg" style="margin-left: 4;"></div>';

;)

Ca pourrait ressembler à ça :

Code:

1
2
3
4
5
6
7
8
9
10
<script type="text/javascript">
	function affiche_lien( idimg )
	{
		document.getElementById('lien_'+idimg).style.display = "block";
	}
	function masque_lien( idimg )
	{
		document.getElementById('lien_'+idimg).style.display = "none";
	}
</script>

En remettant de l'ordre (?) dans ton code :

Code:

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
30
31
32
33
34
<?php
if($nbP>0)
{
	echo 'vous avez '.$nbP.' publication(s)<br />';
	include ('bbcode_function.php');
	while ($Valeur=$resultatpub->fetch())
	{
		$var = $Valeur['desc_Fr'];
		$var2 = $Valeur['desc_En'];
		$desc = bbcode($var);
		$desc2 = bbcode($var2);
		$num_image = $Valeur['idpub'];
?>
	<table>
		<tr>
			<td>
			<div>
				<h3 id="image_<?php echo $num_image; ?>" style="position:relative;">
					<img src="../userImage/<?php echo $Valeur['img_Pr']; ?>" style="height:100px; width:150px;" onmouseover="affiche_lien('<?php echo $num_image; ?>')" onmouseout="masque_lien('<?php echo $num_image; ?>')" alt="<?php echo $Valeur['nom_Fr']; ?>" title="<?php echo $Valeur['nom_Fr']; ?>" />
					<div id="lien_<?php echo $num_image; ?>" style="position:absolute; display:none; top:0; left:0;"><a href=".....">blabla le lien</a></div>
				</h3>
				<h4>Produit : <?php echo $Valeur['nom_Fr']; ?></h4>
				<h5><?php echo $Valeur['date']; ?></h5>
			</div>
			</td>
			<td>
				<?php echo $desc; ?><br /><?php echo $desc2; ?><br /><br /><br /><br /><br /><br /><br /><br />
			</td>
		</tr>
	</table>
<?php
	} // fin while
} // fin if
?>

A adapter et tester...

25/04/2012, 16h11
programmatrice

Merci bien jreaux62
mais comment je peux controler la façon d'affichage du lien
je veux quil soit a droite en haut couleur noir petite taille
A++

'ai mis le style CSS dans le code, mais il peut très bien être dans une feuille de style séparée :
Pour le mettre en haut à droite de l'image :

Code:

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
<style type="text/css">
.h3_image {
  position:relative;
}
.lien_image {
  position:absolute; 
  display:none; 
  top:0; 
  right:0;
.lien_image a {
  color: #000;
  font-size:0.8em;
  /* ajouter ici les autres styles à appliquer ... */
}
 
</style>

Code:

1
2
3
4
				<h3 class="h3_image" id="image_<?php echo $num_image; ?>">
					<img src="../userImage/<?php echo $Valeur['img_Pr']; ?>" style="height:100px; width:150px;" onmouseover="affiche_lien('<?php echo $num_image; ?>')" onmouseout="masque_lien('<?php echo $num_image; ?>')" alt="<?php echo $Valeur['nom_Fr']; ?>" title="<?php echo $Valeur['nom_Fr']; ?>" />
					<div class="lien_image" id="lien_<?php echo $num_image; ?>" style=""><a href=".....">blabla le lien</a></div>
				</h3>

25/04/2012, 17h21
programmatrice

merci
et desolé je n'arive pas a mettre les bonnes valeurs pour que le lien s'affiche DANS ( l'interieur de l'image) à droite en haut
Merci pour votre aide :cry:
25/04/2012, 17h38
Invité

Peux-tu afficher le code généré (html) ? (au moins un bout de ce code)
+ faire une copie d'écran OU UN DESSIN de ce que tu veux exactement ?
Ce n'est pas très clair...
25/04/2012, 17h44
programmatrice
Non c'est simple juste je m'interroge sur les valeurs et attributs au niveau du code css du LIEN (classe) pour l'afficher en haut a droite sur l'image
j'ai besoin du reste ;)
Code:

1 2 3 4 5 6 .lien_image a { color: #000; font-size:0.8em; /* ajouter ici les autres styles à appliquer ... */ }