HTML Bild verlinkung (3-Teilig.)

LEWA · 9. Dezember 2008, 17:50

Ic hhabe da ein ganz schlimmes Problem. (Ist ne längere geschichte...)

Ich habe in meiner Schule HTML udn Webdesing als Fach. Nun, ich soll eine Hausübung machen, (heute erfahren) wo ich ein Bild verlinken soll dass man anklicken kann. Nun das Problem: Das Bild ist 3 Teilig und jede Hälfte (linke, mitte, rechte) soll zu einem anderen Link führen.

Doch da ich letzt woche krank war, habe ich garnichts mitgekriegt wie ich das ansellten soll.

Also: Die verlinkung der Bilder und ebenso das reinstellen, ist nciht das Problem. Das Problem ist, dass ic hkeinen Blassen schimmer hab wie ich ein Foto 3 Teilig mache, sodass ich pro Teil eine verlinkung habe.

Kennt sich da jemand aus?

(Ich habe gehört dass man dieses Bild 3 Teilen muss und dann in HTML irgendwelche koordinaten eingibt. Doch ich habe keinen blassen schimmer...)

Bitte hilfe...

Spellmaker · 9. Dezember 2008, 17:53

Ich hab da mal was gelesen... *kruscht, kram*
Tada, so, ich hoffe das hier hilft dir weiter.

LEWA · 9. Dezember 2008, 18:10

danke.

Doch ich omme trotzdem nicht weiter. Imagemapping habe ich noc hnie gemacht., (udn sehe es zum ersten mal.)

Ich würde gerne eiens wissen:

Wi kann ich das Bild (unterhalb) unterteilen sodass jede Konsole einzeln ancklickbar ist. Das bild ist 400 x 166 pixel Groß.

Kentn sich da jemand aus mit dem System?

flogy · 9. Dezember 2008, 18:45

Diese Frage wurde dir soeben von Spellmaker beantwortet. Mit Hilfe von Image-Mapping!
Ist es denn so schwer, mal einen kurzen Text zu lesen? oO

MfG flogy

LEWA · 9. Dezember 2008, 19:07

Der Text beinhaltet nicht gerade viel für eine anfänger...

Ic hahbe übrigens ein Problem bei einem Code:

HTML-Quellcode

<html>
<head>
<title>imagemaps</title>
</head>
<body>
<map name="konsolenwahl">
<area shape="rect" Coords="0,0,165,0" HREF="XBOX360.html"
</map>
<img src="neoc_konsolen.jpeg" width="400" height"=166"
usemap="#konsolenwahl" Border="0" alt="Konsolenwahl">
</body>
</html>

Alles anzeigen

Das Bild ``neoc_konsolen.jpeg´´ wird nicht angezeigt obwohl es sich im selben ordner befindet wie das html Dokument. Woran kann das liegen?

fabse64 · 9. Dezember 2008, 19:12

HTML-Quellcode

<html>
<head>
<title>imagemaps</title>
</head>
<body>
<map name="konsolenwahl">
<area shape="rect" Coords="0,0,165,0" HREF="XBOX360.html">
</map>
<img src="neoc_konsolen.jpeg" width="400" height"=166"
usemap="#konsolenwahl" Border="0" alt="Konsolenwahl">
</body>
</html>

Alles anzeigen

Du hast das '>' hinter dem AREA-Tag vergessen.

mauge · 9. Dezember 2008, 19:12

Ich kenn mich mit html nicht aus, aber kann man die 3 Bilderlinks nicht einfach nebeneinander stellen? Das müsste doch gehen, wenn du 3 Grafiken daraus machst.

LEWA · 9. Dezember 2008, 19:16

Das ist es ja: Ic hmuss imagemap benutzen.

@fabse64:

Danke doch leider funktioniert es immernoch nciht. es kommt weiterhin das wort ``Konsolenwahl´´ statt dieses Bild...

wolff · 9. Dezember 2008, 19:18

Ich habe html auf selfhtml gelernt. Kann ich dir nur empfehlen :thumbup:

HIer ist das, was du brauchst: de.selfhtml.org/html/grafiken/verweis_sensitive.htm

es kommt weiterhin das wort ``Konsolenwahl´´ statt dieses Bild...

Hast du auch auf Groß-/Kleinschreibung geachtet?

ghost · 9. Dezember 2008, 19:19

Ist das Bild sicher im richtigen Verzeichnis und der Link richtig?

Weil "alt" wird nur angezeigt, wenn das Bild nicht angezeigt werden kann. (wenn ich mich richtig erinnere?)

fabse64 · 9. Dezember 2008, 19:20

Du hast noch einen Fehler im Quelltext...

Spoiler anzeigen

LEWA · 9. Dezember 2008, 19:21

Ja. Ich habe das Bild auf meinem USB Stick in einem Ordner drinnen mit dem HTML Code inklusive. DOch es funtzt nciht! Ebenso wenn ich alles auf meine mDesktop beförder...

Immernoch kommt aber dieses ALT....

J@kob · 9. Dezember 2008, 19:21

schreib mal jpg statt jpeg ...

LEWA · 9. Dezember 2008, 19:24

DANKE! Nun funktioniert es. Komisch. es ist aber ein JPEG File...

Nun muss ich es irgendwie mit den Koordinaten schaffen. Obwohl ich null ahnung habe wie ich es machen soll .(Hab mir allesmögliche darüber durchgelesen.) Trotzdem kann ich das Koordinaten system nicht...

J@kob · 9. Dezember 2008, 19:26

datei endungen bestehen immer aus dreibuchstaben (jpg ist das kürzel für jpeg)

Boddlnagg · 9. Dezember 2008, 19:31

Das stimmt so nicht. Dateiendungen können (zumindest in Windows XP/Vista) beliebig lang sein (auch z.B. 1, 2 oder 4 zeichen). Es gibt genauso auch jpeg Bilder, die wirklich die Endung .jpeg haben. Die kürzere Endung .jpg ist aber deutlich häufiger anzutreffen. Ich nehme an, du hast die Dateiendungen ausgeblendet. Das standardmäßig zu machen, war meiner Meinung nach eine sehr blöde Idee von Microsoft. Ich empfehle, das zu deaktivieren, und zwar geht das, indem man im Windows-Explorer auf "Extras" -> "Ordneroptionen" > "Ansicht" geht und dort das Häkchen vor "Erweiterungen bei bekannten Dateitypen ausblenden" entfernt.

wolff · 9. Dezember 2008, 19:32

So, ich hab gerade langeweile...

PHP-Quellcode

<html>
<head>
<title>imagemaps</title>
</head>
<body>
<p>
<img src="neoc_konsolen.jpg" width="400" height="166" usemap="#konsolenwahl" Border="0" alt="Konsolenwahl">
<map name="konsolenwahl">
<area shape="rect" coords="0,0,133,166"
href="XBOX360.html" alt="XBOX360" title="XBOX360">
<area shape="rect" coords="0,0,266,166"
href="Wiiwaswißich.html" alt="Wii" title="Wii">
<area shape="rect" coords="0,0,400,166"
href="PS3oderso.html" alt="PS3" title="PS3">
</map>
</p>
</body>
</html>

Alles anzeigen

LEWA · 9. Dezember 2008, 20:28

Danke! Der Code hat geholfen!^^

Wirklich! Ist seid alle Super! :thumbsup:

Ich konnte das mit dem Code irgendwie nicht hinkriegen... Hab mir wirklich den Kopf zerbrochen.

Aber danke!

HTML-Quellcode

HTML-Quellcode

PHP-Quellcode

Benutzer online 2