Bonjour,

J'ai bien cherché avec l'outil recherche et je ne trouve pas, donc voilà j'aimerais savoir ou placer ça:

Code:

<map name="panthéon header">
<area shape="rect" alt="K-Surf" coords="329,210,423,272" href="http://serialdesigner.forumactif.fr/t20-l-antre-de-k-surf">
<area shape="rect" alt="Raie-mie" coords="440,210,535,272" href="http://serialdesigner.forumactif.fr/t178-l-antre-du-placard-a-balais">
<area shape="rect" alt="Mimizz" coords="551,210,645,272" href="http://serialdesigner.forumactif.fr/t253-galerie-de-mimizz">
</map>

Pour que les parties définies de mon header soit cliquable ?
Le header

Spoiler:

Merci d'avance K-Surf

On a eu une série de pseudo-tuto sur des PAs réactives mais ceux que j'ai retrouvé ont étés corbeillé/archivés parce-que pas corrects/propres/fonctionnels.

Cependant, il me semblait qu'il y avait un bon tutoriel de base qui expliquait le mapping sur une image. Il n'a pas encore été refondu (d'où le titre pas encore assez explicite si on cherche "mapping"), mais il est tout à fait correct : http://www.css-actif.com/t5072-creer-une-image-reactive?highlight=r%C3%A9active

Est-ce-que cela répond à tes questions ?

Peut-être un élément de réponse ici.



Oups, doublée par Espéon.
Euh, non : Ksurf veut mapper sa bannière, pas sa PA.

@pamina : Je sais bien, mais le tuto ne parle ni de bannière ni de PA, il explique comment mapper une image, tout simplement. Après, l'image peut très bien être une bannière ou une PA

C'est d'ailleurs pour cela qu'il mériterait qu'on le remette en forme, c'est un vrai tutoriel assez général qui couvre tous ces problèmes (suffit de faire 2/3 paragraphes sur les cas particuliers et le tour est joué)


Bref, K-Surf ?

J'ai bien compris, ^^ je connais bien le tuto du mapping et les màj prévues. J'ai juste donné en lien un sujet avec une réponse (à vérifier) sur l'emplacement du code pour une bannière active. J'ai cru comprendre que c'était la question de K-Surf. Mais je peux me tromper...
Je ne suis pas assez calée pour savoir si la réponse donnée dans ce sujet est juste, mais elle m'intéresse.

pamina a écrit:

J'ai bien compris, ^^ je connais bien le tuto du mapping et les màj prévues. J'ai juste donné en lien un sujet avec une réponse (à vérifier) sur l'emplacement du code pour une bannière active. J'ai cru comprendre que c'était la question de K-Surf. Mais je peux me tromper...
Je ne suis pas assez calée pour savoir si la réponse donnée dans ce sujet est juste, mais elle m'intéresse.

J'ai fini de mapper la banniere mais je sais pas ou la placer donc tu as totalement raison pamina c'est ca

PS: je suis sur clavier anglais !

Du coup, c'est résolu ?

Non car ca ne marche pas >> mais je pense ca se rapproche

Code:

<map name="panthéon header">

Commence déjà par retirer cet accent et cet espace '_'
Pour le reste on manque d'éléments pour t'aider, donc pour la énième fois : pourrais tu nous donner le code de ton essai s'il te plait ? (donc le template index_body)

Voilà le code :

Code:

<img name="accueil0" src="http://www.img.dizee.fr/images/headerfrf.png" usemap="#accueil">
<map name="panthéon header">
    ...
</map>

K-Surf, je te laisse trouver l'erreur par toi même.
Indice : le lien c'était un tuto, pas un code à copier/coller (sérieusement...).

Je vois pas j'ai suivi ce tutoriel pour faire cette partie du code :

Code:

<map name="panthéon header">
<area shape="rect" alt="K-Surf" coords="329,210,423,272" href="http://serialdesigner.forumactif.fr/t20-l-antre-de-k-surf">
<area shape="rect" alt="Raie-mie" coords="440,210,535,272" href="http://serialdesigner.forumactif.fr/t178-l-antre-du-placard-a-balais">
<area shape="rect" alt="Mimizz" coords="551,210,645,272" href="http://serialdesigner.forumactif.fr/t253-galerie-de-mimizz">
</map>

Voilà mon template overall header

Espéon t'a déjà donné un indice, et moi de même. Tu as fondamentalement tous les éléments en main pour réaliser ton erreur

Indice bonus : T'es tu seulement demandé à quoi servait l'attribut usemap ?

Je ré-itère, te demande de lire ton code et de réfléchir (tu parle un peu l'anglais tout de même ?) :

Code:

<img name="accueil0" src="http://www.img.dizee.fr/images/headerfrf.png" usemap="#accueil">
<map name="panthéon header">
    ...
</map>

Et pour t'aiguiller, voici ce que ça donnait sur le tuto :

Code:

<img name="accueil0" src="http://www.img.dizee.fr/images/headerfrf.png" usemap="#accueil">
<map name="accueil">
    ...
</map>

Edit: merci 'Christa

J'ai trouvé ça comme définition >> URL ou nom de l'ancre définissant l'image réactive.
Je ne vois pas ou j'ai foiré.... J'indique bien que c'est l'accueil l'image réactive non ?

Edit: faut je remplace "accueil" par panthéon header c'est ça ?

K-Surf a écrit:

Edit: faut je remplace "accueil" par panthéon header c'est ça ?

Ca pourrait être un bon début.
Après, comme le suggérais 'Christa, éviter un nom aussi complexe et avec des espaces (car ça va probablement pas marcher)...

Tu pourrais remplacer panthéon header par pantheon-header, ce qui serait plus correct

ça marche, niquel merci

Sujet résolu !

Je suis bien contente pour toi, mais pourrais-tu indiquer ce que tu as finalement changé, histoire que le sujet soit complet ?
Merci d'avance pour les futurs lecteurs du sujet.

K-Surf a écrit:

Faut je remplace "accueil" par panthéon header c'est ça ?

Oui j'avais posé la bonne question j'ai donc remplacé "#accueuil" par "#pantheon header" (on m'a dit d'enlever l'accent) car le nom de ma map est "name="pantheon header"" je dois donc faire le lien

On t'a aussi dit de retirer l'espace ¬_¬ J'encourage tous ceux qui passeront par ici à ne pas suivre son exemple et à vous souvenir qu'en HTML et CSS les identifiants, classes et autres valeurs ne doivent comporter AUCUN ACCENT NI ESPACE.

Oui j'ai oublié "cette espace"

Bien bien bien... on va donc classer.