Propriete image map avec une css

sylgal45 Messages postés 149 Date d'inscription   Statut Membre Dernière intervention   -  
sylgal45 Messages postés 149 Date d'inscription   Statut Membre Dernière intervention   -
Bonjour,

j'ai sur le site internet une image avec 2 zones cliquables, je souhaite faire en sorte de ne pas avoir le cadre bleu qui montre les liens, je penses donc utiliser ma css voici le code source de ma page.

<div id="prod_AP_tourimg"><img usemap="#imgmap2010112910915" title="MG Éditions création et édition de cartes postales et produits touristiques en petite quantité et personnalisées" alt="MG Éditions création et édition de cartes postales et produits touristiques en petite quantité et personnalisées" src="images/stories/img_accueil_prod_touristique.png" width="730" height="433" />
<map id="imgmap2010112910915" name="imgmap2010112910915">
<area shape="rect" coords="12,15,309,193" href="index.php/cartes-postales" />
<area shape="rect" coords="301,208,587,382" href="index.php/objets-touristiques" />
</map>
</div>
<div id="prod_AP_tourtxt">Revenir avec un souvenir de vacances ou d'un lieu inoubliable...<br /><br /> <strong>MG Éditions</strong> vous propose un trés grand choix de produits personnalisables en petite quantités au meilleur rapport qualité-prix.</div>

merci de me donner un petit coup de main.


A voir également:

11 réponses

LaurentJ
 
Bonjour,
dans ta css, la propriété qui gère l'apparence des liens est
a{color:#000000; text-decoration:none} => couleur des liens
a:hover{color:#FFFFFF} => lien survolé
ceci est une exemple.
dans ton cas, je pense que la première ligne suffira en modifiant à tes goûts.
Salut
0
sylgal45 Messages postés 149 Date d'inscription   Statut Membre Dernière intervention   18
 
Je teste de suite
0
sylgal45 Messages postés 149 Date d'inscription   Statut Membre Dernière intervention   18
 
à première vue ça ne fonctionne pas. précision qui peut avoir son importance, je suis dans joomla, et je mets mon code CSS ci dessous.

/*pages accueil produits touristiques*/
/*positionnement du texte de la page produits touristiques*/
#prod_AP_tourtxt
{
position: absolute;
font-family: Arial, Helvetica, sans-serif;
font-size:14px;
text-align:justify;
float: left;
padding-top: 35px;
padding-left: 410px;
padding-right: 70px;
}
/*positionnement de l'image de la page produits touristiques*/
#prod_AP_tourimg, #prod_AP_tourimg a
{
position: absolute;
/*color:#000000;*/
text-decoration:nome;
/*top: 80 px;
left: 100 px;*/
}
0
LaurentJ
 
essaie de rajouter ceci

src="images/stories/img_accueil_prod_touristique.png" width="730" height="433" style="border:0px;" />

ça devrait arranger ton problème.

ciaooo
0

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

Posez votre question
sylgal45 Messages postés 149 Date d'inscription   Statut Membre Dernière intervention   18
 
Bonsoir et merci pour le tuyau, ça fonctionne. maintenant je rencontre un autre Pb, certaine de mes zones cliquable, sont positionné en partie haute de ma blise <div> ce qui à pour effte dans firefoxe de rendre réelement cliquable la moitié inférieur de cette même zon. les zones situées plus bas dans la balise <div> sont elle complète.

As tu une autres idée de génie, j'avoue que je finis par ne plus savoir ce qui doit être fais.
0
bouzboub Messages postés 14 Date d'inscription   Statut Membre Dernière intervention   2
 
salut,

comment inserer une carte interactive, moi j'ai juste mis une image j'aimerai bien qu'on m'explique merci:


http://la-maison-bel-et-mart-demenagement.fr/acces.php
0
sylgal45 Messages postés 149 Date d'inscription   Statut Membre Dernière intervention   18
 
De ce que j'ai pu voir de ton lien c'est une vrai carte, avec les outils Google tu dois pouvoir ajouter des options d'interactivité de ta carte. il existe des post sur ce sujet.
Pour ce qui est des Images avec Zone interactives, quel outils utilises tu pour le développement de ton site ?
0
LaurentJ
 
pour les zones interactives, j'utilise Dreamweaver. Plus facile pour avoir les coordonnées du premier coup..
0
kiyomasa Messages postés 312 Date d'inscription   Statut Membre Dernière intervention   5
 
Pour Bouzboub:

utilise google maps !
Tu entre ton adresse, puis rechercher.
Tout à droite, tu as "liens", tu clique, puis clique sur "Personnaliser et prévisualiser la carte intégrée".

Là, tu as toute les options. En fonction de la position, la taille, ... Google te génère un code que tu copie colle dans ton site.

C'est bien mieux que Mappy, enfin je trouve.
0
sylgal45 Messages postés 149 Date d'inscription   Statut Membre Dernière intervention   18
 
Je le pense aussi, pour ce qui est du coeur du sujet de ce post, Laurent J m'à permis d'obtenir une solution à un de mes problèmes, mais qui va pouvoir m'apporter la solution à mon second Pb, à savoir le positionnement de ma zone cliquable supérieure et sa taille qui est de 50 % moins grande à l'affichage que dans le code.
0
LaurentJ
 
Tu as un problème de superposition.
ton cadre de texte gêne l'image en arrière-plan. Enlève le padding...
#prod_AP_tourtxt 
{ 
position: absolute; 
font-family: Arial, Helvetica, sans-serif; 
font-size:14px; 
text-align:justify; 
float: left; 
top: 35px; 
left: 410px; 
right: 70px; 
} 


ciaooo
.
0
sylgal45 Messages postés 149 Date d'inscription   Statut Membre Dernière intervention   18
 
OK je te remercie, je teste ça ce soir, je te tiens informé.
0
bouzboub Messages postés 14 Date d'inscription   Statut Membre Dernière intervention   2
 
merci pour toutes vos reponses.
0