• Jetzt anmelden. Es dauert nur 2 Minuten und ist kostenlos!

Bildverweise

Nathdrack

Neues Mitglied
Sali,

ist es möglich wenn man ein Bild hat

http://vogelschule.ch/images/keltischerbaumkreis.jpg <--- wie hier zb. Nur das man da keine Bäume sieht sondern Namen.

Ich möchte die Namen wo am Rand des Kreises stehen gerne als verweise nutzen um auf den bestimmten Anker auf der nächsten Seite zu gelangen.

Ich weiss das es da einen Area shape tag oder so gibt,
aber der Zeigt ja nur die Verweise in einem bestimmten Areal auf dem Bild an.

könnt ihr mir da weiterhelfen?

lg
 
Grundsätzlich funktioniert das mit einem image-map schon, siehe SELFHTML: HTML/XHTML / Grafiken / Verweis-sensitive Grafiken (Image Maps)

Alternativ könntest du etwa so vorgehen:
Die Namen zunächst weglassen und die Grafik als Hintergrundgrafik einbinden.
Dann die Namen in Form einer ul-Liste darstellen.
Die einzelnen li's je Name könntest du dann alle individuell relativ positionieren und so deren "Standord" in der Darstellung festlegen. Erscheint mir jedoch ziemlich aufwendig.
In vereinfachter Form habe ich sowas hier realisiert: http://gehts-gar.net/
 
Danke sehr !

eine fragee habe ich dennoch,

HTML:
 <area shape="rect" coords="11,10,59,29"
 href="http://www.koblenz.de/" alt="Koblenz" title="Koblenz">

die stelle mit den Coords="11,10, 59,29" sagt aus ? von Pixel 11 - 59px nach nach links? etc... verstehe das nicht so :-)
 
"rect" kommt von "rectangle" zu Deutsch "Rechteck". "coords" kommt von Deutsch "Koordinaten".
Ist noch was unklar? :-)
 
Beispiel

EICHENBAUM

HTML:
 <area shape="rect" coords="0,0,60,25"
 href="../meineseite.html #Anker" alt="Eiche" title="Eichenbaum">
Wenn der Schriftzug EICHENBAUM , 60x25px groß ist, ist mit diesem Code der Verweiß direkt über auf dem kompletten Schriftzug?

Und wenn ich ein Bild habe zb. 600x600 , und in der oberen linken Ecke ist der Schriftzug EICHENBAUM, dann muss ich die coords nennen wo der Schriftzug anfängt oder ?
 
HTML:
 <area shape="rect" coords="0,0,60,25"
 href="http://www.html.de/meineseite.html #Anker" alt="Eiche" title="Eichenbaum">
Wenn der Schriftzug EICHENBAUM , 60x25px groß ist, ist mit diesem Code der Verweiß direkt über auf dem kompletten Schriftzug?
Nein, nur wenn der Schriftzug ganz oben links im Image anfängt. Der Code beschreibt ein Rechteck von den Koordinaten (0,0) bis (60,25), also 60px Breite von ganz links und 25px Höhe von ganz oben.

Und wenn ich ein Bild habe zb. 600x600 , und in der oberen linken Ecke ist der Schriftzug EICHENBAUM, dann muss ich die coords nennen wo der Schriftzug anfängt oder ?
Du setzt die Koordinaten eines Rechtecks fest, das den Schriftzug einschließt.
 
Was ist daran falsch? wieso hab ich nur den Link über dem Apfelbaum?

HTML:
<p>
<img src="../Homepagebilder/BaumHoro.jpg" width="600" height="600" border="0" alt="Baum" align="center" usemap="#Baumkarte">
  
      <map name="Baumkarte">
            <area shape="rect" coords="260,100,359,117" 
             href="Banner.html" alt="Apfelbaum" title="Apfelbaum">
         <area shape="rect" coords="451,407,566,424"
             href="banner.html" alt="Feigenbaum" title="Feigenbaum">
         <area shape="rect" coords="417,456,472,478"
             href="banner.html" alt="Hainbuche" title="Hainbuche">
         <area shape="rect" coords="354,481,410,500"
             href="banner.html" alt="Esche" title="Esche">
         <area shape="rect" coords="275,487,325,510"
             href="banner.html" alt="Kastanie" title="Kastanie">
         <area shape="rect" coords="179,479,229,498"
             href="banner.html" alt="Nussbaum" title="Nussbaum">
         <area shape="rect" coords="124,453,192,477"
             href="banner.html" alt="Ahorn" title="Ahorn">
         <area shape="rect" coords="69,407,147,427"
             href="banner.html" alt="Eberesche" title="Eberesche">
         <area shape="rect" coords="379,117,485,135"
            href="banner.html" alt="Haselstrauch" title="Haselstrauch">
         <area shape="rect" coods="430,150,525,170"
             href="banner.html" alt="Linde" title="Linde">
         <area shape="rect" coords="485,184,538,203"
             href="banner.html" alt="Weide" title="Weide">
         <area shape="rect" coods="493,223,581,243"
             href="banner.html" alt="Kiefer" title="Kiefer">
         <area shape="rect" coords="500,270,600,289"
             href="banner.html" alt="Zeder" title="Zeder">
         <area shape="rect" coods="494,317,553,333"
             href="banner.html" alt="Pappel" title="Pappel">
         <area shape="rect" coods="481,358,566,379"
             href="banner.html" alt="Zypresse" title="Zypresse">
         <area shape="rect" coods="65,335,115,376"
             href="banner.html" alt="Ulme" title="Ulme">
         <area shape="rect" coods="45,313,104,232"
             href="banner.html" alt="Tanne" title="Tanne">
         <area shape="rect" coods="4,267,115,287"
             href="banner.html" alt="Z&uuml;rgelbaum" title="Z&uuml;rgelbaum">
         <area shape="rect" coods="59,224,111,244"
             href="banner.html" alt="Eiche" title="Eiche">
         <area shape="rect" coods="74,179,146,205"
             href="banner.html" alt="&Ouml;lbaum" title="Ouml;lbaum">
         <area shape="rect" coods="111,150,166,170"
             href="banner.html" alt="Birke" title="Buche">
         <area shape="rect" coods="166,116,226,134"
             href="banner.html" alt="Buche" title="Buche">     
     </map>
</p>


Habs rausbekommen... ich blöde kuh :S xD
 
Zuletzt bearbeitet:
Zurück
Oben