Insérer un bouton html sur une image

Résolu/Fermé
TommyHook Messages postés 69 Date d'inscription jeudi 3 mars 2011 Statut Membre Dernière intervention 25 octobre 2011 - Modifié par TommyHook le 6/09/2011 à 14:58
TommyHook Messages postés 69 Date d'inscription jeudi 3 mars 2011 Statut Membre Dernière intervention 25 octobre 2011 - 13 oct. 2011 à 15:30
Bonjour, Alors ma question est simple J'ai créer une image que je vais mettre sur un site a l'aide d'un code html.

Cette image
https://imageshack.com/

Sur cette image il y a deux bouton que j'ai créer aussi et j'aimerais qu'en cliquant sur ces boutons ça ouvre une autre page net.
Comment faire ?
Merci Beaucoup



A voir également:

3 réponses

TommyHook Messages postés 69 Date d'inscription jeudi 3 mars 2011 Statut Membre Dernière intervention 25 octobre 2011 5
6 sept. 2011 à 15:44
Up !
1
TommyHook Messages postés 69 Date d'inscription jeudi 3 mars 2011 Statut Membre Dernière intervention 25 octobre 2011 5
Modifié par TommyHook le 12/10/2011 à 12:34
Pareil il faudrait que je fasse la même chose avec cette image j'aimerais ouvrir une page net différente en cliquant sur chaque texte qui se situe sur la même image.

https://imageshack.com/

Comment je pourrais faire ? Merci de répondre rapidement car depuis la dernière fois je n'ai toujours pas de réponse.
0
lossius30 Messages postés 22 Date d'inscription lundi 10 mai 2010 Statut Membre Dernière intervention 5 juin 2014
12 oct. 2011 à 12:45
Salut TommyHook,

Pour faire ça, il faut utiliser les l'élément "map" et l'attribut "usemap" :

<!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=utf-8" />
<title>Document sans nom</title>
</head>

<body>
<map name="image1map">
<area shape="rect" coords="501,159,666,219" href="https://www.google.fr/?gws_rd=ssl">
<area shape="rect" coords="160,158,325,218" href="https://www.google.fr/?gws_rd=ssl">
</map>
<img src="http://img14.imageshack.us/img14/5140/fffffwp.jpg" usemap="#image1map" />
</body>
</html>

remplace https://www.google.fr/?gws_rd=ssl par ton lien.
Pour les coordonnées, il vaut mieux les modifier avec un prog comme dreamweaver (visuel)
0
TommyHook Messages postés 69 Date d'inscription jeudi 3 mars 2011 Statut Membre Dernière intervention 25 octobre 2011 5
12 oct. 2011 à 12:52
Ok Merci Beaucoup pour ta réponse =) Je vais essayer ça
Si j'ai un soucis est ce que tu pourras m'expliquer en détails ? Merci Beaucoup en tout cas
Je testerais ce soir quand je rentrerais.
0
lossius30 Messages postés 22 Date d'inscription lundi 10 mai 2010 Statut Membre Dernière intervention 5 juin 2014
12 oct. 2011 à 12:54
AllHtml est une référence, c'est très bien expliqué, regarde par la : http://www.allhtml.com/articles/detail/371
0
TommyHook Messages postés 69 Date d'inscription jeudi 3 mars 2011 Statut Membre Dernière intervention 25 octobre 2011 5
13 oct. 2011 à 15:30
Merci Beaucoup ! J'ai trouvé la solution sur un autre site car les codes HTML que je mettais ne fonctionnais pas où l'image n'apparaissait pas. J'ai utiliser GIMP pour que les codes HTML marche.
Je vous met le lien du site où j'ai trouver une solution.
En tout cas Merci Beaucoup pour ton aide lossius30 ça m'a permis de comprendre le fonctionnement de ces balise. =)

http://www.infetech.com/article.php3?id_article=159
0