A voir également:
- Coordonnées area en pourcentages
- Coordonnées gps - Guide
- Moyenne de plusieurs pourcentages excel - Guide
- Envoyer coordonnées gps par sms - Accueil - Téléphones
- Moyenne de pourcentages - Forum Excel
- Moyenne pourcentage dans un tableau évolutif ✓ - Forum Excel
7 réponses
salut,
j'ai vérifié parce que je pensais ça impossible.
normalement tu as juste à ajouter '%' à tes valeurs comme 50%.
la spec. précise :
et un type longueur peut être
mais je n'ai jamais testé et ne l'ai jamais vu tourner.
qu'à tu fait exactement ?
quel est ton code et ce code fonctionne-t-il avec des valeurs en pixel ?
j'ai vérifié parce que je pensais ça impossible.
normalement tu as juste à ajouter '%' à tes valeurs comme 50%.
la spec. précise :
Les coordonnées sont relatives au coin supérieur gauche de l'objet. Toutes les valeurs sont du type longueur. Toutes les valeurs sont séparées par des virgules.
et un type longueur peut être
un pourcentage de l'espace horizontal ou vertical disponible. Ainsi, la valeur "50%" signifie la moitié de l'espace disponible
mais je n'ai jamais testé et ne l'ai jamais vu tourner.
qu'à tu fait exactement ?
quel est ton code et ce code fonctionne-t-il avec des valeurs en pixel ?
J'ai essayé plusieurs choses mais pour l'instant rien ne fonctionne. j'ai essayé plusieurs versions du code :
<img src="index.jpg" width="100%" height="100%" border="0" usemap="#Map" />
<map name="Map" id="Map">
<area shape="rect" coords="11,5,23,34" href="aliona.html" />
<area shape="rect" coords="3,34,14,69" href="flo.html" />
</map>
ou alors :
<img src="index.jpg" width="100%" height="100%" border="0" usemap="#Map" />
<map name="Map" id="Map">
<area shape="rect" coords="11%,5%,23%,34%" href="aliona.html" />
<area shape="rect" coords="3%,34%,14%,69%" href="flo.html" />
</map>
Ou encore :
<body>
<img src="index.jpg" width="100%" height="100%" border="0" usemap="#Map" />
<map name="Map" id="Map">
<area shape="rect" coords="11%","5%","23%","34%" href="aliona.html" />
<area shape="rect" coords="3%","34%,"14%,"69%" href="flo.html" />
</map>
</body>
</html>
Bref j'agence les guillemets, les signes % dans tous les sens mais rien n'a fonctionné !
<img src="index.jpg" width="100%" height="100%" border="0" usemap="#Map" />
<map name="Map" id="Map">
<area shape="rect" coords="11,5,23,34" href="aliona.html" />
<area shape="rect" coords="3,34,14,69" href="flo.html" />
</map>
ou alors :
<img src="index.jpg" width="100%" height="100%" border="0" usemap="#Map" />
<map name="Map" id="Map">
<area shape="rect" coords="11%,5%,23%,34%" href="aliona.html" />
<area shape="rect" coords="3%,34%,14%,69%" href="flo.html" />
</map>
Ou encore :
<body>
<img src="index.jpg" width="100%" height="100%" border="0" usemap="#Map" />
<map name="Map" id="Map">
<area shape="rect" coords="11%","5%","23%","34%" href="aliona.html" />
<area shape="rect" coords="3%","34%,"14%,"69%" href="flo.html" />
</map>
</body>
</html>
Bref j'agence les guillemets, les signes % dans tous les sens mais rien n'a fonctionné !
ah oui et si je laisse tout en pixel ça tourne nickel.
Le problème c'est que je veux une image dont la largeur soit 100% pour faire un design adaptable à la résolution du visiteur. Mais Impossible avec une image map aux coordonnées indiquées en pixel, ça décale tout et c'est le boxon.
J'ai lu aussi sur le net que c'était possible mais impossible de trouver d'autres infos.
Le problème c'est que je veux une image dont la largeur soit 100% pour faire un design adaptable à la résolution du visiteur. Mais Impossible avec une image map aux coordonnées indiquées en pixel, ça décale tout et c'est le boxon.
J'ai lu aussi sur le net que c'était possible mais impossible de trouver d'autres infos.
salut,
je ne trouve pas d'exemple qui fonctionne, je trouve même des indications contraires :
source, mais ce n'est pas daté donc l'info n'est peut être plus d'actualité…
pourquoi veux-tu utiliser les % ?
si c'est par commodité de calcul, tu peux utiliser un éditeur graphique pour définir tes coordonnées.
Amaya le permet, il suffit de créer ta <map> avec puis de copier/coller le code produit dans le tien.
je ne trouve pas d'exemple qui fonctionne, je trouve même des indications contraires :
No major browsers understand percentage coordinates correctly, and all interpret percentage coordinates as pixel coordinates
source, mais ce n'est pas daté donc l'info n'est peut être plus d'actualité…
pourquoi veux-tu utiliser les % ?
si c'est par commodité de calcul, tu peux utiliser un éditeur graphique pour définir tes coordonnées.
Amaya le permet, il suffit de créer ta <map> avec puis de copier/coller le code produit dans le tien.
Vous n’avez pas trouvé la réponse que vous recherchez ?
Posez votre question
J'ai continué à chercher aussi mais tu as raison, les navigateurs ne reconnaissent pas les valeurs en %.
Je vais devoir trouver autre chose !
Je voulais cette image-map en page d'accueil du site, mais je voulais aussi un design adaptable à la résolution du visiteur .. Donc une image dont la largeur serait indiquée en % et non en pixels. Mais c'est impossible de le faire avec une image-map du coup ..
Merci de ton aide
Je vais devoir trouver autre chose !
Je voulais cette image-map en page d'accueil du site, mais je voulais aussi un design adaptable à la résolution du visiteur .. Donc une image dont la largeur serait indiquée en % et non en pixels. Mais c'est impossible de le faire avec une image-map du coup ..
Merci de ton aide
une image dont la largeur serait indiquée en % et non en pixels
tu aurais dû commencer par là je t'aurais de suite dit que ce n'était pas possible…
bon courage pour la suite !
-;o)
Dans la cadre de l'adaptation de mes sites aux smarphones, j'ai trouvé une astuce pour réduire les images avec map et area.
Je refait mon image avec map dans une résolution compatible smartphone (par exemple 280px. Puis dans le css pour site classique je crée une class "zoom_200"
dans la page html :
<div class="zoom_200"><img ... ></div>
dans le css site classique :
.zoom_200
{
zoom:200%;
}
dans le css site mobile :
.zoom_200
{
zoom:100%;
}
Je refait mon image avec map dans une résolution compatible smartphone (par exemple 280px. Puis dans le css pour site classique je crée une class "zoom_200"
dans la page html :
<div class="zoom_200"><img ... ></div>
dans le css site classique :
.zoom_200
{
zoom:200%;
}
dans le css site mobile :
.zoom_200
{
zoom:100%;
}