[css] Faire d'une image un lien

**Ace_Denghar** · 10/09/2005, 12h10

Bonjour,

Même pour mois mon titre ne semble pas clair...

Alors je vais vous montrer ce que j'ai fait :

Fichier index.php

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
6
7
 
<table>
	<tr>
		<a href="./"><td class="cadrelogo"></td></a>
		<a href="http://www.lienexterne.fr"><td class="cadrepublicite"></td></a>
	</tr>
</table>

Fichier CSS

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
6
7
8
 
.cadrelogo /* Cadre contenant le logo su site */
{
	width:	295px;
	height: 133px;
	background-image: url(./images/interface/interface01/logo01.jpg);
	background-repeat: no-repeat;
}

Mon problême, c'est que même si l'image est correctement affichée et que le lien fonctionne, si je passe le curseur de la souris dessus celu-ci ne devient pas la "main" classique indiquant qu'il y'a un lien.

Pour obtenir le résultat voulu, je suis contraint d'utiliser un "href" avec un "img src" dans le code de la page d'index alors que je voudrais pouvoir changer d'image si le besoin s'en fait ressentir en utilisant le fichier Css correspondant à la page.

Y'a-t-il autre chose que "background-image" pour subvenir à mon besoin ?

Je vous remercie pour vos futurs eclaircissements.

A+

Ace

**Auteur** · 10/09/2005, 13h03

bonjour,

Fichier index.php
Code:

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
6
7
 
<table>
   <tr>
      <a href="./"><td class="cadrelogo"></td></a>
      <a href="http://www.lienexterne.fr"><td class="cadrepublicite"></td></a>
   </tr>
</table>

oooooooooh, ce code !!! Même si le HTML est assez permissif, il ne faut pas en profiter. D'ailleurs tu risques d'avoir des soucis avec certains navigateurs.

La balise TD vient après une balise TR
Syntaxe d'une table :

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
6
7
 
<table>
   <tr>
      <td>.......</td>
      <td>.......</td>
   </tr>
</table>

malheureusement, pour une balise img tu ne peux pas spécifier l'url dans le CSS.

Voilà un compromis : on passe par le javascript. La fonction ChargeImg() est exécutée lors du chargement de la page.

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
30
31
32
33
 
<html>
<head>
	<title></title>
</head>
<style type="text/css">
.cadrelogo
{
   width:   295px;
   height: 133px;
   border-style: none;
}
</style>
 
<script type="text/javascript">
function ChargeImg(){
var elmtID;
 
elmtID=document.getElementById("idImg");
elmtID.src="logo01.jpg";
}
</script>
 
<body onload="ChargeImg()">
<table border="1" bgcolor="" width="">
   <tr>
	 <td><a href="MaPage.htm"><img id="idImg" class="cadrelogo" src=""></a></td>
   </tr>
</table>
 
</body>
 
</html>

**Ace_Denghar** · 10/09/2005, 13h38

Salut,

oooooooooh, ce code !!! Même si le HTML est assez permissif, il ne faut pas en profiter. D'ailleurs tu risques d'avoir des soucis avec certains navigateurs.

Merci pour les conseils et la réponse. Je débute en html alors je prends tous les conseils ;-)

Merci beaucoup pour ton astuce mais je ne veux pas utiliser de javascript.

Je vais donc faire un include portant sur une page gérant le logo.

A+

Ace

[css] Faire d'une image un lien

CSS

Discussions similaires

Partager

Partager