Sujets similaires

Je valide en mettant un Niveau Expert car celui-ci est assez compliqué. De plus, il n'est pas adapté à toutes les personnes puisque tu utilise Photoshop. Certaines personnes ne le possèdent pas Wink

Pour les débutants et non-possesseurs de Photoshop, consultez plutôt celui-ci.

ah c'est cool ça ! je vais surement essayer !
merci beaucoup !

De rien

N'hésite pas si tu as le moindre problème!

@ Haricoow: en fait, n'importe quelle version de Photoshop peut faire l'affaire (supérieure ou antérieure à CS3). A la limite, ça aurait été encore plus simple de le faire avec une version antérieure, car il y aurait eu ImageReady Wink

Mais je n'ai que cette version, et peu de personnes ont ImageReady

Et puis, faire une demande de Découpage dans les demandes de code peut toujours se faire si certains ont vraiment envie d'un mapping

(en soi, c'est une demande de code, vu la fin du 1er chapitre ^^) Sinon, j'ai justement détaillé la partie photoshop pour qu'on puisse le faire même avec une version d'essai Wink

Est-ce que c'est normal que mon image à l'apparence d'un gif maintenant, avec pleins de pixels inesthétiques . ?

As-tu bien enregistré en "PNG-24" ? (dans la fenêtre "enregistrer pour le web")
Et as-tu fait toutes les étapes?
Sinon, tu peux me montrer un aperçu?

@ Jill : Un aperçu ne serait pas suffisant pour résoudre le problème Wink

@ Sweet.V : Pourrais-tu me passer l'adresse de ton image hébergée ainsi que le code entier si tu as déjà commencé à coder ton image ?

Oui, c'est pas faux Créer une PA réactive / mapping 465622

Enfin bref, ça doit surement venir de la première étape, puisque je ne vois pas en quoi un code peut influer sur la qualité de l'image o_O

Mais si tu as tout fait, avoir ton code ne serait pas de refus pour voir où est le problème ^^

@ Haricoow: Par contre, ce sera forcément plusieurs images, et pas une seule Wink

*Lève la main*

J'ai un petit problème! :S Quand j'ai enregistrer mes images, l'image "spacer" n'est pas apparu... donc léger problème pour le mettre dans mon ficher... pouvez vous m'aider?

Etrange :cyclops:

Peux-tu me montrer le code que tu as eu avec le découpage? (quand tu clique sur "aperçu" pour enregistrer sur le web)

Sinon, as tu bien regardé dans tous les formats? Vu que l'image spacer est un .gif alors que tes images de PA sont des .jpg

Ouais! Je suis aller voir directement dans le dossier des images quand c'est pas apparu.

Spoiler:

Code:: Format : PNG-24
Dimensions : 1302 l x 608 h
Taille : 513,9 K
Images : 10
Paramètres : Entrelacé, Transparence Activé

<html>
<head>
<title>pa</title>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
</head>
<body bgcolor="#FFFFFF" leftmargin="0" topmargin="0" marginwidth="0" marginheight="0">

<table id="Tableau_01" width="1303" height="609" border="0" cellpadding="0" cellspacing="0">
<tr>
   <td colspan="6">
      <img src="BrowserPreview_01.png" width="1302" height="132" alt=""></td>
   <td>
      <img src="spacer.gif" width="1" height="132" alt=""></td>
</tr>
<tr>
   <td colspan="4">
      <img src="BrowserPreview_02.png" width="699" height="73" alt=""></td>
   <td rowspan="2">
      <img src="BrowserPreview_03.png" width="571" height="103" alt=""></td>
   <td rowspan="4">
      <img src="BrowserPreview_04.png" width="32" height="476" alt=""></td>
   <td>
      <img src="spacer.gif" width="1" height="73" alt=""></td>
</tr>
<tr>
   <td rowspan="3">
      <img src="BrowserPreview_05.png" width="60" height="403" alt=""></td>
   <td rowspan="2">
      <img src="BrowserPreview_06.png" width="354" height="198" alt=""></td>
   <td colspan="2">
      <img src="BrowserPreview_07.png" width="285" height="30" alt=""></td>
   <td>
      <img src="spacer.gif" width="1" height="30" alt=""></td>
</tr>
<tr>
   <td rowspan="2">
      <img src="BrowserPreview_08.png" width="108" height="373" alt=""></td>
   <td colspan="2" rowspan="2">
      <img src="BrowserPreview_09.png" width="748" height="373" alt=""></td>
   <td>
      <img src="spacer.gif" width="1" height="168" alt=""></td>
</tr>
<tr>
   <td>
      <img src="BrowserPreview_10.png" width="354" height="205" alt=""></td>
   <td>
      <img src="spacer.gif" width="1" height="205" alt=""></td>
</tr>
<tr>
   <td>
      <img src="spacer.gif" width="60" height="1" alt=""></td>
   <td>
      <img src="spacer.gif" width="354" height="1" alt=""></td>
   <td>
      <img src="spacer.gif" width="108" height="1" alt=""></td>
   <td>
      <img src="spacer.gif" width="177" height="1" alt=""></td>
   <td>
      <img src="spacer.gif" width="571" height="1" alt=""></td>
   <td>
      <img src="spacer.gif" width="32" height="1" alt=""></td>
   <td></td>
</tr>
</table>

</body>
</html>

Merci de bien vouloir m'aider. Embarassed

Mmh, as-tu essayé de ré-enregistrer tes images?

En fait, ce n'est pas une fin en soi de ne pas avoir le spacer.gif. Il s'agit juste d'une image de 1 x 1px qui permet de ne pas avoir de bug sous mozilla. Du coup, peu importe d'où elle provient.

Si vraiment tu n'arrives pas à l'obtenir en ré-enregistrant, tu n'as qu'à prendre celle-ci:

Citation :

(alors, oui, on pourrait croire qu'il n'y a rien ^^, mais sélectionne quand même avec ta souris, et "enregistre l'image sous". Il s'agit d'un petit pixel, donc il faut bien viser. Je pourrais te dire de prendre directement l'adresse de l'image, mais si un jour je supprime l'hébergement de cette image, tu seras pas forcément avantagée ^^")

Après il te suffit de la ré-héberger sur un site conçu pour Smile

Oui j'ai essayer de les réenregistrer des tonnes de fois.. :S

*Se gratte la tête*

Bon, j'ai pris ton image et je l'ai mis partout où c'était écrit spacer.gif. Cependant, j'ai toujours des espaces dans ma PA...

http://potterworld3.forumactif.org

Voici mon code:

Spoiler:

Code:: <html>
<head>
<title>pa</title>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
</head>
<body bgcolor="#FFFFFF" leftmargin="0" topmargin="0" marginwidth="0" marginheight="0">

<table id="Tableau_01" width="1303" height="609" border="0" cellpadding="0" cellspacing="0">
<tr>
   <td colspan="7">
      <img src="http://moe.mabul.org/up/moe/2010/07/23/img-030645j5g8t.gif" width="1302" height="134" alt=""></td>
   <td>
      <img src="http://moe.mabul.org/up/moe/2010/07/23/img-13315481o0t.gif" width="1" height="134" alt=""></td>
</tr>
<tr>
   <td colspan="4">
      <img src="http://moe.mabul.org/up/moe/2010/07/23/img-0309279ebmx.gif" width="704" height="73" alt=""></td>
   <td colspan="2"><div class="need"><marquee onmouseover="this.stop();" onmouseout="this.start();" Scrolldelay="115">
<IMG border="0" alt="" src="http://files.o-side.com/upload/CSSActif/css-actif-8831.gif"></div></td>
   <td rowspan="4">
      <img src="http://moe.mabul.org/up/moe/2010/07/23/img-0311015dv7v.gif" width="35" height="474" alt=""></td>
   <td>
      <img src="http://moe.mabul.org/up/moe/2010/07/23/img-13315481o0t.gif" width="1" height="73" alt=""></td>
</tr>
<tr>
   <td rowspan="3">
      <img src="http://moe.mabul.org/up/moe/2010/07/23/img-031210y2ctp.gif" width="60" height="401" alt=""></td>
   <td rowspan="2"><div class="News">Ici sera mit les news</div></td>
   <td colspan="2">
      <img src="http://moe.mabul.org/up/moe/2010/07/23/img-031253ptpgz.gif" width="287" height="27" alt=""></td>
   <td>
      <img src="http://moe.mabul.org/up/moe/2010/07/23/img-13315481o0t.gif" width="1" height="27" alt=""></td>
</tr>
<tr>
   <td rowspan="2">
      <img src="http://moe.mabul.org/up/moe/2010/07/23/img-0313116l9d0.gif" width="110" height="374" alt=""></td>
   <td colspan="2" rowspan="2">
      <img src="http://moe.mabul.org/up/moe/2010/07/23/img-03133059ddv.gif" width="563" height="374" alt=""USEMAP="#général"></td>
   <td rowspan="2">
      <img src="http://moe.mabul.org/up/moe/2010/07/23/img-031347x7hrj.gif" width="177" height="374" alt=""></td>
   <td>
      <img src="http://moe.mabul.org/up/moe/2010/07/23/img-13315481o0t.gif" width="1" height="176" alt=""></td>
</tr>
<tr>
   <td>
      <img src="http://moe.mabul.org/up/moe/2010/07/23/img-031405sx26j.gif" width="357" height="198" alt="" USEMAP="#top_site">></td>
   <td>
      <img src="http://moe.mabul.org/up/moe/2010/07/23/img-13315481o0t.gif" width="1" height="198" alt=""></td>
</tr>
<tr>
   <td>
      <img src="http://moe.mabul.org/up/moe/2010/07/23/img-13315481o0t.gif" width="60" height="1" alt=""></td>
   <td>
      <img src="http://moe.mabul.org/up/moe/2010/07/23/img-13315481o0t.gif" width="357" height="1" alt=""></td>
   <td>
      <img src="http://moe.mabul.org/up/moe/2010/07/23/img-13315481o0t.gif" width="110" height="1" alt=""></td>
   <td>
      <img src="http://moe.mabul.org/up/moe/2010/07/23/img-13315481o0t.gif" width="177" height="1" alt=""></td>
   <td>
      <img src="http://moe.mabul.org/up/moe/2010/07/23/img-13315481o0t.gif" width="386" height="1" alt=""></td>
   <td>
      <img src="http://moe.mabul.org/up/moe/2010/07/23/img-13315481o0t.gif" width="177" height="1" alt=""></td>
   <td>
      <img src="http://moe.mabul.org/up/moe/2010/07/23/img-13315481o0t.gif" width="35" height="1" alt=""></td>
   <td></td>
</tr>
</table>
<MAP NAME="général">
<AREA SHAPE="rect" ALT="Règlement" COORDS="10,44,178,100" HREF="http://vampires-dawn.forumactif.com/reglements-f4/">
<AREA SHAPE="rect" ALT="Contexte" COORDS="131,112,299,168" HREF="http://vampires-dawn.forumactif.com/contexte-f92/a-new-family-in-forks-so-dangerous-t24.htm">
<AREA SHAPE="rect" ALT="Staff" COORDS="284,161,370,210" HREF="http://vampires-dawn.forumactif.com/fork-s-journal-f3/the-vampire-s-dawn-staff-t73.htm">
</MAP>

<MAP NAME="top_site">
<AREA SHAPE="rect" ALT="Manipulation" COORDS="0,7,53,123" HREF="http://focus-flo.e-monsite.com/">
<AREA SHAPE="rect" ALT="Breaking dawn" COORDS="75,74,128,123" HREF="http://breaking-dawn.forumotion.com/">
<AREA SHAPE="rect" ALT="Immortals war" COORDS="155,73,208,123" HREF="http://immortals-war.forumactif.com/index.htm">
<AREA SHAPE="rect" ALT="Célébrité nous les fans" COORDS="231,73,284,123" HREF="http://celebrity.nouslesfans.com/forum.htm">
<AREA SHAPE="rect" ALT="Twilight Passion" COORDS="302,73,355,123" HREF="http://twilight-passion.forumactif.com/">
</MAP>

</body>
</html>

Et tu n'as pas de css? Mine de rien, ça joue pas mal dans la disposition de ta PA Wink

D'ailleurs, comment se fait-il que tes images de PA soient en .gif? As-tu bien enregistré en "PNG-24"? scratch

(dans la fenêtre "enregistrer pour le web")

Coucou,

Je connais le mapping mais quand tu as encadré les liens tu peux faire Enregistrer une copie optimisée sous... et tu choisis Html et images. Comme ça tu as directement le code HTML que tu peux ouvrir sous Bloc Note ou autre avec déjà tout d'écris ! Et ensuite plus qu'a héberger les images, à les rajouter aux emplacements indiqués et à mettre les url pour les liens Wink

.

Coucou à tous !

Alors moi j'ai un petit problème, mais la Page ne s'affiche pas du tout comme je le voudrais, les liens sont absents ... Bref j'ai vraiment l'impression d'avoir tout capoter. Après avoir cherché à mainte et mainte reprises je ne trouve pas où sont mes erreurs ! J'aurais besoin d'un ... gros, c'est le cas, coup de main. Je vous mets, Code, Css et Screen à disposition. (Ps : Je m'excuse si les erreurs sont grosses et nombreuses d'avance)

Merci d'avance Smile

Image de base :

Spoiler:

Image finale :

Spoiler:

Code HTML :

Spoiler:

Oops -^-^- Désolé du dernier spoiler et de ce double post, je me suis trompé :

Spoiler:

Code:: <html>
<head>
<title>PA</title>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
</head>
<body bgcolor="#FFFFFF" leftmargin="0" topmargin="0" marginwidth="0" marginheight="0">

<table id="Tableau_01" width="854" height="645" border="0" cellpadding="0" cellspacing="0">
<tr>
   <td colspan="2" rowspan="2"> <td width="30%" class="cellule">
<div class="titre">Contexte</div>
<div class="fenêtre" style="overflow:auto; height:100px;">
[En cours]
</div>
</td>
      <img src="http://nsm03.casimages.com/img/2010/07/23//100723064549499756450859.png" width="251" height="195" alt="USEMAP="#contexte""></td>
   <td rowspan="2">
      <img src="http://nsm03.casimages.com/img/2010/07/23//100723064550499756450860.png" width="31" height="195" alt=""></td>
   <td colspan="5">
      <img src="http://nsm03.casimages.com/img/2010/07/23//100723064550499756450861.png" width="323" height="100" alt="USEMAP="#Forum""></td>
   <td colspan="2" rowspan="6">
      <img src="http://nsm03.casimages.com/img/2010/07/23//100723064551499756450862.png" width="248" height="352" alt=""></td>
   <td>
      <img src="http://nsa17.casimages.com/img/2010/07/23/100723065920822396.png" width="1" height="100" alt=""></td>
</tr>
<tr>
   <td colspan="5" rowspan="2">
      <img src="http://nsm03.casimages.com/img/2010/07/23//100723064551499756450863.png" width="323" height="110" alt=""></td>
   <td>
      <img src="http://nsa17.casimages.com/img/2010/07/23/100723065920822396.png" width="1" height="95" alt=""></td>
</tr>
<tr>
   <td colspan="3" rowspan="6">
      <img src="http://nsm03.casimages.com/img/2010/07/23//100723064551499756450864.png" width="282" height="202" alt="USEMAP="#Navigation1""></td>
   <td>
      <img src="http://nsa17.casimages.com/img/2010/07/23/100723065920822396.png" width="1" height="15" alt=""></td>
</tr>
<tr>
   <td colspan="2">
      <img src="http://nsm03.casimages.com/img/2010/07/23//100723064552499756450865.png" width="104" height="59" alt=""></td>
   <td>
      <img src="http://nsm03.casimages.com/img/2010/07/23//100723064552499756450866.png" width="102" height="59" alt=""></td>
   <td>
      <img src="http://nsm03.casimages.com/img/2010/07/23//100723064552499756450867.png" width="102" height="59" alt=""></td>
   <td rowspan="9">
      <img src="http://nsm03.casimages.com/img/2010/07/23//100723064552499756450868.png" width="15" height="434" alt=""></td>
   <td>
      <img src="http://nsa17.casimages.com/img/2010/07/23/100723065920822396.png" width="1" height="59" alt=""></td>
</tr>
<tr>
   <td colspan="2">
</td>
      <img src="http://nsm03.casimages.com/img/2010/07/23//100723064552499756450869.png" width="104" height="60" alt=""></td>
   <td>
      <img src="http://nsm03.casimages.com/img/2010/07/23//100723064552499756450870.png" width="102" height="60" alt=""></td>
   <td>
      <img src="http://nsm03.casimages.com/img/2010/07/23//100723064553499756450871.png" width="102" height="60" alt=""></td>
   <td>
      <img src="http://nsa17.casimages.com/img/2010/07/23/100723065920822396.png" width="1" height="60" alt=""></td>
</tr>
<tr>
   <td colspan="2" rowspan="2">
      <img src="http://nsm03.casimages.com/img/2010/07/23//100723064553499756450872.png" width="104" height="58" alt=""></td>
   <td rowspan="7">
      <img src="http://nsm03.casimages.com/img/2010/07/23//100723064553499756450873.png" width="102" height="315" alt=""></td>
   <td rowspan="2">
      <img src="http://nsm03.casimages.com/img/2010/07/23//100723064553499756450874.png" width="102" height="58" alt=""></td>
   <td>
      <img src="http://nsa17.casimages.com/img/2010/07/23/100723065920822396.png" width="1" height="23" alt=""></td>
</tr>
<tr>
   <td rowspan="6">
      <img src="http://nsm03.casimages.com/img/2010/07/23//100723064553499756450875.png" width="105" height="292" alt=""></td>
   <td rowspan="4">
      <img src="http://nsm03.casimages.com/img/2010/07/23//100723064553499756450876.png" width="143" height="97" alt="USEMAP="#Top_site""></td>
   <td>
      <img src="http://nsa17.casimages.com/img/2010/07/23/100723065920822396.png" width="1" height="35" alt=""></td>
</tr>
<tr>
   <td colspan="2" rowspan="2">
      <img src="http://nsm03.casimages.com/img/2010/07/23//100723064554499756450877.png" width="104" height="44" alt=""></td>
   <td rowspan="5">
      <img src="http://nsm03.casimages.com/img/2010/07/23//100723064554499756450878.png" width="102" height="257" alt=""></td>
   <td>
      <img src="http://nsa17.casimages.com/img/2010/07/23/100723065920822396.png" width="1" height="10" alt=""></td>
</tr>
<tr>
   <td colspan="3">
      <img src="http://nsm03.casimages.com/img/2010/07/23//100723064648499756450885.png" width="282" height="34" alt=""></td>
   <td>
      <img src="http://nsa17.casimages.com/img/2010/07/23/100723065920822396.png" width="1" height="34" alt=""></td>
</tr>
<tr>
   <td rowspan="3">
      <img src="http://nsm03.casimages.com/img/2010/07/23//100723064649499756450886.png" width="166" height="213" alt=""></td>
   <td colspan="3" rowspan="2">
      <img src="http://nsm03.casimages.com/img/2010/07/23//100723064649499756450887.png" width="203" height="135" alt="USEMAP="#Navigation2""></td>
   <td rowspan="3">
      <img src="http://nsm03.casimages.com/img/2010/07/23//100723064649499756450888.png" width="17" height="213" alt=""></td>
   <td>
      <img src="http://nsa17.casimages.com/img/2010/07/23/100723065920822396.png" width="1" height="18" alt=""></td>
</tr>
<tr>
   <td rowspan="2">
      <img src="http://nsm03.casimages.com/img/2010/07/23//100723064649499756450889.png" width="143" height="195" alt=""></td>
   <td>
      <img src="http://nsa17.casimages.com/img/2010/07/23/100723065920822396.png" width="1" height="117" alt=""></td>
</tr>
<tr>
   <td colspan="3">
      <img src="http://nsm03.casimages.com/img/2010/07/23//100723064649499756450890.png" width="203" height="78" alt=""></td>
   <td>
      <img src="http://nsa17.casimages.com/img/2010/07/23/100723065920822396.png" width="1" height="78" alt=""></td>
</tr>
<tr>
   <td>
      <img src="http://nsa17.casimages.com/img/2010/07/23/100723065920822396.png" width="166" height="1" alt=""></td>
   <td>
      <img src="http://nsa17.casimages.com/img/2010/07/23/100723065920822396.png" width="85" height="1" alt=""></td>
   <td>
      <img src="http://nsa17.casimages.com/img/2010/07/23/100723065920822396.png" width="31" height="1" alt=""></td>
   <td>
      <img src="http://nsa17.casimages.com/img/2010/07/23/100723065920822396.png" width="87" height="1" alt=""></td>
   <td>
      <img src="http://nsa17.casimages.com/img/2010/07/23/100723065920822396.png" width="17" height="1" alt=""></td>
   <td>
      <img src="http://nsa17.casimages.com/img/2010/07/23/100723065920822396.png" width="102" height="1" alt=""></td>
   <td>
      <img src="http://nsa17.casimages.com/img/2010/07/23/100723065920822396.png" width="102" height="1" alt=""></td>
   <td>
      <img src="http://nsa17.casimages.com/img/2010/07/23/100723065920822396.png" width="15" height="1" alt=""></td>
   <td>
      <img src="http://nsa17.casimages.com/img/2010/07/23/100723065920822396.png" width="105" height="1" alt=""></td>
   <td>
      <img src="http://nsa17.casimages.com/img/2010/07/23/100723065920822396.png" width="143" height="1" alt=""></td>
   <td></td>
</tr>
</table>

<MAP NAME="Navigation1">
<AREA SHAPE="rect" ALT="Règles" COORDS="65,285,155,329" HREF="http://narutosensouv3.forumotion.com/reglements-backgrounds-f2/">
<AREA SHAPE="rect" ALT="Présentations" COORDS="86,353,259,401" HREF="http://narutosensouv3.forumotion.com/presentation-de-votre-shinobi-f4/">
</MAP>

<MAP NAME="Navigation2">
<AREA SHAPE="rect" ALT="Fiche Technique" COORDS="153,437,374,491" HREF="http://narutosensouv3.forumotion.com/fiches-techniques-f32/">
<AREA SHAPE="rect" ALT="Flood !" COORDS="260,507,369,556" HREF="http://narutosensouv3.forumotion.com/coin-flood-f28/">
</MAP>

<MAP NAME="Top_site">
<AREA SHAPE="rect" ALT="Top1" COORDS="708,352,851,398" HREF="http://">
<AREA SHAPE="rect" ALT="Top2" COORDS="709,404,852,450" HREF="http://">
</MAP>

<MAP NAME="Forum">
<AREA SHAPE="rect" ALT="Bienvenue" COORDS="277,0,605,88" HREF="http://narutosensouv3.forumotion.com/index.htm">
</MAP>


</body>
</html>

En effet, je vois plein de petites erreurs qui se sont glissées dans ton mapping ^^"

Donc on va faire ça en plusieurs fois Wink

En premier lieu, il me faut ton css

Un chose que tu peux changer tout de suite, c'est l'image qui remplace le "spacer", pourquoi est-ce un .png? Il devrait être en .gif

Ensuite, des choses que je peux voir directement:

Tu as mis un "USEMAP" pour l'image du contexte, ce qui n'est pas logique si tu veux écrire dedans. Le USEMAP est utilisé pour donner un lien vers le forum. Si tu le mets, le contexte ne pourra pas se mettre dedans. (je sais pas si je suis très claire ^^')

Je m'occuperais plus intensivement du reste demain sinon =)

Re-bonsoir =) Merci de me répondre c'est vraiment sympa Smile

Alors voilà mon Css :

Spoiler:

Code:: td.cat,td.catHead,td.catSides,td.catLeft,td.catRight,td.catBottom {
border: 0px;
-moz-border-radius: 10px;
}
td.cat,td.catHead,td.catSides,td.catLeft,td.catRight,td.catBottom {
border: 0px;
-moz-border-radius: 10px;
}
td.row1,td.row3.over:hover {
-moz-border-radius: 10px;
}
td.row2,td.row1.over:hover {
-moz-border-radius: 10px;
}
td.row3{
-moz-border-radius: 10px;
}
td.rowpic {
-moz-border-radius: 10px;
}
td.row3Right,td.spaceRow {
-moz-border-radius: 10px;
}

a { text-decoration: none; }

a.hover { text-decoration: none; }

a.mainmenu {
background-color: #2a3330;
padding-right: 10px;
font-weight: bold;
-moz-border-radius-topright: 15px;
-moz-border-radius-topleft: 15px;
text-transform: uppercase;
color : #606060;
font-size: 10px;
}

a.mainmenu:hover{
background-color: #794c46;
padding-right: 10px;
font-weight: bold;
-moz-border-radius-topright: 15px;
-moz-border-radius-topleft: 15px;
text-transform: uppercase;
color : #DD6900;
font-size: 12px;
}

.statistiques{
border:0px;
background-image: url("http://d20.e-loader.net/yMr7KsejgV.jpg");
background-repeat: no-repeat;
background-position: center;
height:280px;}

.groupes{
background-color:#FFFFFF;border: 1px #D0D0D0 dotted;
-moz-border-radius : 5px 5px 5px 5px;
height:40px;padding-right:12px;padding-left:14px;padding-bottom:3px;
font-size:13px;font-weight: bold;text-align:center;
text-decoration: none !important;}

.sujets_messages
{margin-top: 3px;
padding: 3px;

border: 1px solid #000000;
background-image: url(http://img411.imageshack.us/img411/4715/sanstitre3ex.png);}

.derniers_sujets
{margin-top: 3px;
padding: 3px;

border: 1px dashed #000000;
background-image: url(http://img411.imageshack.us/img411/4715/sanstitre3ex.png);
-moz-border-radius-topleft: 10px;
-moz-border-radius-bottomright: 10px;}

.vignettes
{-moz-border-radius:7px;
background-color: #FDFDFD;
padding-right:10px;
padding-left:10px;
padding-bottom: 3px;
padding-top:3px;}

.teexte {
-moz-text-shadow: 2px 2px 3px #ffffff;
-webkit-text-shadow: 2px 2px 3px #ffffff;
text-shadow: 2px 2px 3px #ffffff;
}

.postdetails.poster-profile a img {
-moz-border-radius-bottomleft:10px;
-moz-border-radius-bottomright:10px;
-moz-border-radius-topleft:10px;
-moz-border-radius-topright:10px;
border: 5px solid #000000;
}

.opacity img {
filter:alpha(opacity=50);
-moz-opacity:0.5;opacity: 0.5;
}

.opacity img:hover {
filter:alpha(opacity=100);
-moz-opacity:1;opacity: 1;
}

a {
font-variant: small-caps;
}
.cellule {
color: #000000;
font-size:12px;
background-color: #4e5a64;
padding-left:10px;
padding-right:10px;
padding-bottom:3px;
text-align:center;
-moz-border-radius:10px;
-webkit-border-radius:10px;
vertical-align:top;}
.titre {
text-align:left;
font-variant: small-caps;
border-bottom: 1px solid #9F9E93;
padding-left:10px;}
.fenêtre {
text-align:justify;
padding-right:5px;}
.menunavdeux a:link, .menunavdeux a:visited, .menunavdeux a:active {
display: block;
color: #9f9e93;
text-align:left;
text-transform:uppercase;
text-decoration: none;
border-right: 30px double #9F9E93;
background-color: #cccccc;
padding: 3px;}
.menunavdeux a:hover {
color: #80838C;
letter-spacing: -1px;
text-decoration: none !important;
background-color: #cccccc;
border-right: 30px double #80838C;}
img {margin:2px; border: none;}
a:link {text-decoration: none; color: #000000;}
a:hover{text-decoration: none !important; color: #CCCCCC;}
a:visited {text-decoration: none; color: #000000;}
a:active {text-decoration: none; color: #000000;}
.nom {
color: #000000;
text-transform:uppercase;
padding:5px;}
a.img {text-decoration:none;}
a.info {text-decoration: none;}
a.info:hover {color: #525451;}
a.infobulle {position: relative;}
a.infobulle span {display: none;width:150px;}
a.infobulle:hover {background: none;z-index: 999;}
a.infobulle:hover span {
display: inline;
position: absolute;
white-space: nowrap;
top: -30px;
left: 15px;
background-color: #CCCCCC;
padding: 3px;
border: 1px solid #ffffff;
-moz-border-radius: 10px;
-webkit-border-radius:10px;}

div.infobulle_avatar em {
display:none;
}

div.infobulle_avatar:hover {
background:none;
z-index: 999;
cursor: hand;
position: relative;
text-decoration:none;
border: 0;
}

div.infobulle_avatar:hover em {
font-style: normal; /*écriture de la police*/
font-size: 10px; /*taille de la police*/
color:#000 !important; /*couleur de la police*/
padding: 3px;
display: block;
position: absolute;
-moz-border-radius: 5px; /* bord arrondis*/
-webkit-border-radius: 5px; /* bord arrondis*/
border-radius: 5px ; /* bord arrondis*/
background-color: #FFF; /*couleur de fond de l'infobulle*/
border: 1px solid #000; /*taille et couleur de la bordure de l'infobulle*/
width:150px; /*largeur de l'infobulle*/
top: 100px; /*infobulle à 100px du haut*/
left: 100px; /*infobulle à 100px de la gauche*/
}

.contourfiche {
width: 70%;
color: #848884;
text-align:justify;
border:2px solid 191919;
background-color: #4e5a64;
-moz-border-radius:20px;
-webkit-border-radius:20px;
padding:20px;}

.titrefiche {
color: #01454D;
font-size:19px;
text-align:left;
border-bottom:2px solid #01454D;
padding-bottom:10px;}

.soustitrefiche {color: #000000;}

.opacity img {
filter:alpha(opacity=50);
-moz-opacity:0.5;opacity: 0.5;
}

.opacity img:hover {
filter:alpha(opacity=100);
-moz-opacity:1;opacity: 1;
}

.postdetails.poster-profile a img {
-moz-border-radius-bottomleft:10px;
-moz-border-radius-bottomright:10px;
-moz-border-radius-topleft:10px;
-moz-border-radius-topright:10px;
border: 5px solid #000000;
}
a.forumlink{
font-weight: lighter;
background-color: #4e5a64;
border-bottom: 5px double #000000;
display:block;
text-align: center;
-moz-border-radius: 7px 7px 7px 7px;
letter-spacing: 1px;
font-size: 12px;}

.forum-description {
margin: auto;
padding: 10px;
color: #000000;
width: 80%;
border: 3px solid #000000;
-moz-border-radius: 14px;
-webkit-border-radius: 14px;
font-size: 12px;
}

.forum-stats {
-moz-border-radius-topleft: 20px;
-moz-border-radius-topright: 20px;
-webkit-border-top-right-radius: 20px;
-webkit-border-top-left-radius: 20px;
border-top-right-radius: 20px;
border-top-left-radius: 20px;
border-bottom: 0 none !important;
border-left: 3px solid #000000;
border-right: 3px solid #000000;
border-top: 3px solid #000000;
color: #000000;
font-size: 11px;
font-style: italic;
height: 14px;
left: 280px;
padding: 3px;
position: relative;
text-align: center;
width: 200px;
}

.forum-sousforum {
color: #000000;
border: 3px solid #000000;
border-top: 0px !important;
-moz-border-radius-bottomleft: 14px;
-moz-border-radius-bottomright: 14px;
-webkit-border-bottom-right-radius: 14px;
-webkit-border-bottom-left-radius: 14px;
border-bottom-right-radius: 14px;
border-bottom-left-radius: 14px;
margin: auto;
padding: 4px;
color: #000000;
width: 50%;
text-align: center;
height: 14px;
font-size: 11px;
}
textarea, .textarea.post, input.post {
-moz-border-radius:10px;
}
.bodyline {
-moz-border-radius:10px;
}

-Pour spacer.png j'ai cru qu'il fallait l'héberger en .png n'ayant pas trouvé en .gif ^^.

- Ouèp j'ai compris pour le USEMAP et j'aurais du réfléchir en le faisant x) >.<

Merci encore et bonne soirée =)

De rien

En fait, tu n'as rien mis dans ton css? (en rapport avec le mapping) Si oui, désolée, je suis pas bien réveillée --"

Pour le spacer, pour moi, ils sont toujours apparu en .gif, après, c'est vrai que je ne sais pas si ça change réellement quelque chose ^^"

Sinon, tu t'es un peu mélangée, et le problème du mapping, c'est qu'une seule petite faute peut tout faire flinguer ^^'

Je peux tout te rattraper si tu veux, mais pour ça il me faudrait aussi ton code de début (celui que tu as quand tu fais "aperçu" dans "enregistrer pour le web")

Et aussi un screenshoot de ton image avec ses tranches visibles, comme celle-ci:

Spoiler:

voila =)

Bonjour bonjour =)

Tout d'abord merci de prendre du temps pour moi ^^.

- Sur le CSS seule cette partie me sert afin de compléter la partie pour le Contexte du Forum :

Code:: .cellule {
color: #000000;
font-size:12px;
background-color: #4e5a64;
padding-left:10px;
padding-right:10px;
padding-bottom:3px;
text-align:center;
-moz-border-radius:10px;
-webkit-border-radius:10px;
vertical-align:top;}
.titre {
text-align:left;
font-variant: small-caps;
border-bottom: 1px solid #9F9E93;
padding-left:10px;}

-Pour le spacer j'ai changé et à priori le .png ne changeait pas car l'état de la Page d'accueil est toujours le même. En tout cas merci de ta proposition même si cela me gêne un peu ^^. Donc ci-joint le code de l'aperçu et le screen des tranches Smile

Spoiler:

Code:: Format : Mixte
Dimensions : 853 l x 644 h
Taille : 302,2 K
Images : 24

<html>
<head>
<title>PA</title>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
</head>
<body bgcolor="#FFFFFF" leftmargin="0" topmargin="0" marginwidth="0" marginheight="0">

<table id="Tableau_01" width="854" height="645" border="0" cellpadding="0" cellspacing="0">
<tr>
   <td colspan="3" rowspan="2">
      <img src="BrowserPreview_01.gif" width="249" height="195" alt=""></td>
   <td colspan="2" rowspan="4">
      <img src="BrowserPreview_02.gif" width="32" height="284" alt=""></td>
   <td rowspan="3">
      <img src="BrowserPreview_03.gif" width="4" height="211" alt=""></td>
   <td colspan="3">
      <img src="BrowserPreview_04.gif" width="314" height="80" alt=""></td>
   <td colspan="2" rowspan="5">
      <img src="BrowserPreview_05.gif" width="254" height="351" alt=""></td>
   <td>
      <img src="spacer.gif" width="1" height="80" alt=""></td>
</tr>
<tr>
   <td colspan="3" rowspan="2">
      <img src="BrowserPreview_06.gif" width="314" height="131" alt=""></td>
   <td>
      <img src="spacer.gif" width="1" height="115" alt=""></td>
</tr>
<tr>
   <td colspan="3" rowspan="2">
      <img src="BrowserPreview_07.gif" width="249" height="89" alt=""></td>
   <td>
      <img src="spacer.gif" width="1" height="16" alt=""></td>
</tr>
<tr>
   <td colspan="3" rowspan="3">
      <img src="BrowserPreview_08.gif" width="310" height="177" alt=""></td>
   <td rowspan="8">
      <img src="BrowserPreview_09.gif" width="8" height="433" alt=""></td>
   <td>
      <img src="spacer.gif" width="1" height="73" alt=""></td>
</tr>
<tr>
   <td rowspan="7">
      <img src="BrowserPreview_10.gif" width="53" height="360" alt=""></td>
   <td colspan="3" rowspan="3">
      <img src="BrowserPreview_11.png" width="206" height="118" alt=""></td>
   <td rowspan="4">
      <img src="BrowserPreview_12.gif" width="22" height="156" alt=""></td>
   <td>
      <img src="spacer.gif" width="1" height="67" alt=""></td>
</tr>
<tr>
   <td rowspan="6">
      <img src="BrowserPreview_13.gif" width="112" height="293" alt=""></td>
   <td rowspan="4">
      <img src="BrowserPreview_14.gif" width="142" height="99" alt=""></td>
   <td>
      <img src="spacer.gif" width="1" height="37" alt=""></td>
</tr>
<tr>
   <td colspan="3" rowspan="2">
      <img src="BrowserPreview_15.gif" width="310" height="52" alt=""></td>
   <td>
      <img src="spacer.gif" width="1" height="14" alt=""></td>
</tr>
<tr>
   <td colspan="2">
      <img src="BrowserPreview_16.gif" width="196" height="38" alt=""></td>
   <td>
      <img src="BrowserPreview_17.gif" width="10" height="38" alt=""></td>
   <td>
      <img src="spacer.gif" width="1" height="38" alt=""></td>
</tr>
<tr>
   <td rowspan="3">
      <img src="BrowserPreview_18.gif" width="109" height="204" alt=""></td>
   <td colspan="5" rowspan="2">
      <img src="BrowserPreview_19.gif" width="205" height="113" alt=""></td>
   <td rowspan="3">
      <img src="BrowserPreview_20.gif" width="224" height="204" alt=""></td>
   <td>
      <img src="spacer.gif" width="1" height="10" alt=""></td>
</tr>
<tr>
   <td rowspan="2">
      <img src="BrowserPreview_21.gif" width="142" height="194" alt=""></td>
   <td>
      <img src="spacer.gif" width="1" height="103" alt=""></td>
</tr>
<tr>
   <td>
      <img src="BrowserPreview_22.gif" width="87" height="91" alt=""></td>
   <td colspan="2">
      <img src="BrowserPreview_23.gif" width="32" height="91" alt=""></td>
   <td colspan="2">
      <img src="BrowserPreview_24.gif" width="86" height="91" alt=""></td>
   <td>
      <img src="spacer.gif" width="1" height="91" alt=""></td>
</tr>
<tr>
   <td>
      <img src="spacer.gif" width="53" height="1" alt=""></td>
   <td>
      <img src="spacer.gif" width="109" height="1" alt=""></td>
   <td>
      <img src="spacer.gif" width="87" height="1" alt=""></td>
   <td>
      <img src="spacer.gif" width="10" height="1" alt=""></td>
   <td>
      <img src="spacer.gif" width="22" height="1" alt=""></td>
   <td>
      <img src="spacer.gif" width="4" height="1" alt=""></td>
   <td>
      <img src="spacer.gif" width="82" height="1" alt=""></td>
   <td>
      <img src="spacer.gif" width="224" height="1" alt=""></td>
   <td>
      <img src="spacer.gif" width="8" height="1" alt=""></td>
   <td>
      <img src="spacer.gif" width="112" height="1" alt=""></td>
   <td>
      <img src="spacer.gif" width="142" height="1" alt=""></td>
   <td></td>
</tr>
</table>

</body>
</html>

Spoiler:

Ps : Merci encore :geek:

Oulala

Je comprends maintenant pourquoi tu t'es emmêlée les pinceaux!

Il y a beaucoup de tranches inutiles dans ton mapping Shocked

Et en voulant le remplir convenablement, je me suis rendue compte que tu avais oubliée d'en héberger certaines! (par exemple, la tranche 3) Normal ensuite que rien ne s'arrange correctement Wink

J'étais en train de me poser la question sur le retrancher de nouveau, et je pense que c'est la meilleure solution ^^ Par avance, ne t'inquiètes pas, ça ne me dérange pas du tout Very Happy

J'aime bien faire des mapping, je trouve que c'est un exercice de logique assez formidable Smile

Tu l'auras ce soir ou demain, je pense ^^ Et puis tu as fait l'effort de le tenter, je me vois mal te laisser en plan Wink

Je sais vraiment pas quoi dire à part merci !

Ps : J'ai encore tenté aujourd'hui mais le même problème persiste ... I'm so nul xD

- J'ai honte de demander cela mais entre temps j'ai changer d'image et je voulais savoir si c'était possible que tu fasses sur la nouvelle ci-jointe. (Booouhhhh !!!! Embarassed

)

Spoiler:

Merci beaucoup encore Smile

Pas de problème Very Happy

Ce sera encore plus facile vu la nouvelle disposition de tes liens ^^

Juste une question: pour le html/css, tu veux la partie: contexte, nos potes, et les crédits (tu veux y faire défiler quelque chose?)?
Image réactive (USEMPAP): top sites, navigation, nous lier, être affiché, et les quatres images du haut?

Après l'avoir fait, je te ferais un récapitulatif de tes principales erreurs (ce serait trop long et peut-être pas assez bien expliqué de te le faire faire). Je ferais un comparé entre ton ancienne map et la nouvelle Wink

Pour être dans les règles j'aurais préféré que cette demande se fasse dans la section spécialisée (Demande de Codes) et non en plein tutoriel :/ Créer une PA réactive / mapping 732153

Je me pose en effet la même question :cyclops: Mais je pensais poster ensuite les différences et les erreurs qui se sont posées pour son mapping. Et vu que la demande de code ne demande justement que le code et pas d'explications, je suis restée ici. Mais si ça gêne, il suffit que Miyu poste dans l'autre catégorie (mais pareil, là bas, il n'y a pas de place)

Du coup, on s'arrange comment? Neutral

Créer une PA réactive / mapping

Créer une PA réactive / mapping

Sujets similaires

Sujets similaires

Partenaires Or