Forum
Tipps
News
Menu-Icon

Verschiedenen Text Popups in einer Grafik

Hallo,

ich habe eine Karte als GIF erstellt mit einigen "Hinweispunkten". Wenn man diese Hinweispunkte mit der Maus überfährt soll sich ein Textfeld mit einer Beschreibung öffnen. Für ein einzelnes Bild geht das ja mit JS aber wie geht das mit mehreren Textfeldern pro Bild ?

Hier die Karte

 


Antworten zu Verschiedenen Text Popups in einer Grafik:

Hat dir diese Antwort geholfen?

Danke ButtonHilfreiche Antwort Button

Mit ner Image-Map würde ich sagen (ja, schon wieder).

Hier hast du nochmal den Link: http://de.selfhtml.org/html/grafiken/verweis_sensitive.htm

Da kann man denke ich bei den einzelnen Areas dann onMouseOver und onMouseOut definieren... (habs aber noch nie ausprobiert).
 

Hat dir diese Antwort geholfen?

Danke ButtonHilfreiche Antwort Button

Hallo,

ja, danke. Diesen Link kannte ich und das wende ich auch an. Will aber nur, dass ein Text erscheint ud nicht das ich auf eine weitere Seite verlinke. Sozusagen mouseovre aber das ist ja hier nicht wirklich beschrieben

Der Tag href="#" dient als "Dummy" und verweist nicht auf eine andere Seite sondern sorgt dafür, dass der "Pseudolink" auf die gleiche Seite verweist, bei Klick also nicht die Seite wechselt.

Hat dir diese Antwort geholfen?

Danke ButtonHilfreiche Antwort Button

Was du brauchst ist eine Funktionalität für Tooltips. Eine schöne Programmierbibliothek gibt's von Walter Zorn, und zwar hier:
http://www.walterzorn.de/tooltip/tooltip.htm

Doku ist auch vorhanden ;)

greez 8)
JoSsiF

Hat dir diese Antwort geholfen?

Danke ButtonHilfreiche Antwort Button

Versuch doch das hier:

Zitat
Wenn Sie eine Fläche explizit als nicht anklickbar ausweisen wollen, können Sie dies mit dem Attribut nohref tun (ohne Wertzuweisung).

Du gibst also kein Verweisziel an, lediglich ein onMouseOver und onMouseOut.

Btw: Wenn die Texte nur kurz sind, reicht es vielleicht auch schon aus, das "title"-Attribut zu setzen, dann brauchst du gar kein JavaScript. 

Hat dir diese Antwort geholfen?

Danke ButtonHilfreiche Antwort Button

Hallo,

danke für Eure Tips. Das Handikap ist ja, dass ich für jeden Punkt der Karte, der ausgewiesen ist, einen Text setzen will. ALso muss ich mit Koordinaten arbeiten und da stecke ich gerade fest

Hat dir diese Antwort geholfen?

Danke ButtonHilfreiche Antwort Button

Naja das klärt sich ja dann über die Image Map...

Hat dir diese Antwort geholfen?

Danke ButtonHilfreiche Antwort Button

Für Euch vielleicht. Für mich ist noch nicht klar, wie ich die Imagemap mit dem mouseover verbinde. Imagemap allein mit Link kein Problem, aber beides ?

So stelle ich ja einen Link mit einer Imagemap her:

 

Zitat
<map name="Map"><area shape="rect" coords="201,107,288,132" href="../../index.php">

Aber wie verknüpfe ich die Imagemap mit dem Mouseover ?

 
Zitat
<area onmouseover="return escape('Dies ist Area 1')" shape=... >   
« Letzte Änderung: 27.01.07, 14:17:37 von frank_gayer »

Hat dir diese Antwort geholfen?

Danke ButtonHilfreiche Antwort Button

Hast du mal mit title versucht?

Also so:
<area title="Dies ist Area 1" shape="rect" coords="201,107,288,132" nohref>   

Hat dir diese Antwort geholfen?

Danke ButtonHilfreiche Antwort Button

Wenn ich das so einfüge:

 

Zitat
<script language="JavaScript" type="text/javascript" src="../../java/wz_tooltip.js"></script>

<map name="Zone1">
<area title="Zone1" shape="rect" coords="201,107,288,132" nohref></map></body>
</html>

Dann ist immer meine Imagemap-Zone weg

Hat dir diese Antwort geholfen?

Danke ButtonHilfreiche Antwort Button

Sorry, aber wie doof kann man sich eigentlich anstellen?

Hier: http://www.fsi.fh-trier.de/~scheitt/test/test.html

Darfst den Quelltext gerne kopieren, aber wie gesagt, geht nur mit kurzen Texten.

Hat dir diese Antwort geholfen?

Danke ButtonHilfreiche Antwort Button

So doof, dass ich es jetzt verstehe. Praktische Beispiele sind meist besser als Theorie. Danke erstmal

Hat dir diese Antwort geholfen?

Danke ButtonHilfreiche Antwort Button

Joa, is schon klar, manchmal steht man einfach aufm Schlauch.

Nur hatte ich halt oben noch extra folgendes geschrieben:

Zitat
Btw: Wenn die Texte nur kurz sind, reicht es vielleicht auch schon aus, das "title"-Attribut zu setzen, dann brauchst du gar kein JavaScript.
Ich schreibe also, dass dann kein JavaScript mehr benötigt wird, und du kommst dann mit JavaScript (und scheinbar sogar ohne Image(?))
Manchmal meint man halt, die Leute würden sich das, was man so schreibt, einfach nicht durchlesen.

Was an der Lösung da halt doof ist, is, dass es relativ lange dauert, bis der Tooltip kommt. Daher vielleicht noch style="cursor:help" bei den Areas mit einfügen (habs in dem Beispiel auch noch mal geändert).

Oder halt doch noch auf JavaScript umsteigen.

Hat dir diese Antwort geholfen?

Danke ButtonHilfreiche Antwort Button

Ist OK, habe alles gelesen und auch versucht. Klappte wie gesagt nicht. Danke nochmals für den Tip, habe das jetzt mal so gemacht und gefällt mir ganz gut. 

Hat dir diese Antwort geholfen?

Danke ButtonHilfreiche Antwort Button

Wann gibt's auf deiner Website eigentlich ein "powered by computerhilfen.de"? ;D;)

Hat dir diese Antwort geholfen?

Danke ButtonHilfreiche Antwort Button

Gerne, ich nehme auf jeden Fall den Link zu dieser Seite auf. Ob ich "power by.." schreibe, weis ich noch nicht.

Es sind ja nur die Programmiersachen von CH und nicht die ganze Seite. Dankeaber für die tolle Hilfe.

Schicke mir mal einen Banner per Email.

 

Hat dir diese Antwort geholfen?

Danke ButtonHilfreiche Antwort Button

Einen geringfügig satirischen Hauch möchte ich meiner vorherigen "Frage" nicht absprechen ;):D  ...natürlich ist das für dich in keinster Weise verpflichtend.

Dennoch würden nico, martin und der Rest des Teams sich sicherlich über einen Link freuen :)

Logos gibt's hier:
http://www.computerhilfen.de/computerhilfen_presse.php3

Und für die Direktverlinkung sollte es hier etwas geben:
http://www.computerhilfen.de/computerhilfen_banner.php3

und
http://www.computerhilfen.de/computerhilfen_buttons.php3


...tut es aber nicht, weil die Bilder nicht existieren  :-[  -> Ich frag mal nach.

greez 8)
JoSsiF

Hat dir diese Antwort geholfen?

Danke ButtonHilfreiche Antwort Button

Sorry, falscher Alarm bei mir. Meine Firewall hat die Bilder geblockt, sie sind aber da ;)

Hat dir diese Antwort geholfen?

Danke ButtonHilfreiche Antwort Button

Selbstverständlich sofort eingefügt und verlinkt


« Hyperlink im iFrame anzeigenWebcam im internet zur verfügung stellen? »
 

Schnelle Hilfe: Hier nach ähnlichen Fragen und passenden Tipps suchen!

Fremdwörter? Erklärungen im Lexikon!
Ethernetkarte
Die Ethernetkarte, auch Netzwerkkarte genannt, ist ein Bauteil, um einzelne Computer an ein Netzwerk anzuschließen. Ursprünglich waren Ethernetkarten eigenst&a...

Grafikkarte
Eine Grafikkarte ist ein wesentlicher Bestandteil eines Personal Computers, der für die Erzeugung und Weiterleitung von Bildsignalen an den Monitor verantwortlich is...

Netzwerkkarte
Die Ethernetkarte, auch Netzwerkkarte, wird benötigt, um mehrere Rechner zu vernetzen (zum Beispiel, um einen Drucker mit mehreren Computern zu benutzen, oder schnel...