mouseover bei imagemaps
Wannenmacher
>funktioniert der mousover event eigentlich auch bei imagemaps?
>ich würde gern auf einem gruppenbild bei einem mouseover infos zu der
>betreffenden person einblenden.
>
>weiss jemand ob und wie das geht?
Hallo
¨Das sollte schon funktionieren. Meiner Meinung nach musst du aber das Foto
so unterteilen, dass jeder Kopf ein einzelnes Bild ist und dann diese vielen
kleinen Bildchen mit einer Tabelle "zusammenfügen". Dann kannst du bei jedem
Kopf ein Mouseover-Objekt einfügen.
<img src="kopf1.jpg" alt="Kopf1" onMouseover="Erklaerung()">
Mfg
Raffael Wannenmacher
--------------------------------------------------
http://www.raffael.my-web.de/
René Schläpfer
lege über Dein Bild Layers, bei jeder Person z.B. über den Kopf. In die
Layer legst Du ein transparentes Gif, welchem Du die gewünschte grösse
gibst, das der Kopf mit den Transparenten Gif gedekt ist. Jetzt machst Du
ein Mausover wie gewohnt.
Gruss
René Schläpfer
Gerold Strobel schrieb in Nachricht <36eb9...@news.w-4.de>...
>Hi!
>
>funktioniert der mousover event eigentlich auch bei imagemaps?
>ich würde gern auf einem gruppenbild bei einem mouseover infos zu der
>betreffenden person einblenden.
>
>weiss jemand ob und wie das geht?
>
>--
>
>
>
>Gerry
>
>
>~*~*~*~*~*~*~*~*~*~*~*~*~*~*~*~*~*~*~*~
> http://www.gerold-strobel.de
>MICROSOFT JOKES and my PGP-key
>~*~*~*~*~*~*~*~*~*~*~*~*~*~*~*~*~*~*~*~
>
>
>
Hajo Pflueger
> funktioniert der mousover event eigentlich auch bei imagemaps?
> ich würde gern auf einem gruppenbild bei einem mouseover infos zu der
> betreffenden person einblenden.
ja, Du mußt nur das onMouseOver in der <area> definieren.
Cheatah
--
I am a signature-virus. Why don't copy me into your sig?
Come to Cheatah's World at http://cheatah.net/
The World of Linkrotations, Fun and more!
Get your OWN FREE Linkrotation!
Hatto von Hatzfeld
<7cg1lp$snf$1...@bw107zhb.bluewin.ch>...
>
>>funktioniert der mousover event eigentlich auch bei imagemaps?
>>ich würde gern auf einem gruppenbild bei einem mouseover infos zu
der
>>betreffenden person einblenden.
>>
>
das Foto
>so unterteilen, dass jeder Kopf ein einzelnes Bild ist und dann diese
vielen
>kleinen Bildchen mit einer Tabelle "zusammenfügen". Dann kannst du
bei jedem
>Kopf ein Mouseover-Objekt einfügen.
Diese Arbeit ist unnötig, falls man nicht auch einen Bildwechsel haben
will. Das onMouseover-Event funktioniert auch beim <area ...>.
Grüße,
Hatto
--
Sehr beachtenswerte Quellen:
SELFHTML von Stefan Muenz: http://www.teamone.de/selfhtml/
FAQ http://www.mintert.com/javascript/de.comp.lang.javascript.html
Christines JavaScript-Notizen: http://www.screenExa.net/js_notiz/
Michael Praast
>ich würde gern auf einem gruppenbild bei einem mouseover infos zu der
>betreffenden person einblenden.
>
>weiss jemand ob und wie das geht?
<AREA SHAPE=CIRCLE COORDS="x,y,r" HREF="#"
onMouseOver="wasdutunwillst()">
Oder hapert es an dem "wasdutunwillst()" ? Dann beschreib mal bitte
genauer, was passieren soll. Eine Kurzinfo in einem seperatem Fenster
oder ein Link auf eine seperate Seite ? Eventuell kannst Du, sofern es
nur eine sehr kurze Info ist, etwas mit dem "PopUp" auf meinen Seiten
anfangen.
Best regards
Michael
«
--
"Reply to:" funktioniert !
Meine Seiten: http://home.t-online.de/home/Michael.Praast/index.htm
(Bitte Browser >= 4.x benutzen wg. JavaScript.)
Rufinus
willst ist das möglich, nur sehr kompliziert :)
schau dir das mal an, da steht das wie:
http://www.webreference.com/dhtml/column2/index.html
CU
Rufinus
Gerold Strobel <ger...@w-4.de> wrote in message
news:36eb9...@news.w-4.de...
>Hi!
>
>funktioniert der mousover event eigentlich auch bei imagemaps?
>ich würde gern auf einem gruppenbild bei einem mouseover infos zu der
>betreffenden person einblenden.
>
>weiss jemand ob und wie das geht?
>
Hajo Pflueger
> wenn du eine imagemap hast, und für jeden link einen image rollover effect
> willst ist das möglich, nur sehr kompliziert :)
wenn er die Grafik der Imagemap ändern will, ja. Wenn er etwas anderes
machen will (z.B. einen Text in der Statuszeile anzeigen), nein. Das ist
gaaanz einfach.
Julian Bessenroth
wrote:
>> wenn du eine imagemap hast, und für jeden link einen image rollover effect
>> willst ist das möglich, nur sehr kompliziert :)
>
>wenn er die Grafik der Imagemap ändern will, ja. Wenn er etwas anderes
>machen will (z.B. einen Text in der Statuszeile anzeigen), nein. Das ist
>gaaanz einfach.
Hi, ist vielleich nicht ganz genau das Thema, aber ich habe ein
Aehnliches problem :
Ich will ein ganz normales gif-Bild per meuseOver oder meinetwegen
auch ueber onClick durch ein anderes ersetzen, was ja bis hierher ganz
einfach ist, aber das ersetzte Gif soll ein imagemap/usemap sein.
Wie definiere ich dann aber die einzelnen areas, wenn das vorherige
Bild kein imagemap/usemap und zu dem auch noch kleiner war?????
(enschuldigt die klemmende Taste, aber ich bin ratlos).
Viel Spass
Julian B-)
--julian bessenroth---------------------------------------
email : mailto:julian.b...@snafu.de OR
mailto:julian.b...@gmx.de
homepage : http://www.snafu.de/~julian.bessenroth/
----------------[animated gifs, hotlinks and more]--------
Hajo Pflueger
> Ich will ein ganz normales gif-Bild per meuseOver oder meinetwegen
> auch ueber onClick durch ein anderes ersetzen, was ja bis hierher ganz
> einfach ist, aber das ersetzte Gif soll ein imagemap/usemap sein.
> Wie definiere ich dann aber die einzelnen areas, wenn das vorherige
> Bild kein imagemap/usemap und zu dem auch noch kleiner war?????
> (enschuldigt die klemmende Taste, aber ich bin ratlos).
Du kannst immer nur eine komplette Grafik ersetzen. Eine Imagemap ist
immer noch nur *eine* Grafik, auch wenn mehrere Areas definiert wurden.
Und mit Grafiken in verschiedenen Größen hat mindestens Netscape noch
arge Probleme...
Julian Bessenroth
wrote:
>> einfach ist, aber das ersetzte Gif soll ein imagemap/usemap sein.
>> Wie definiere ich dann aber die einzelnen areas, wenn das vorherige
>> Bild kein imagemap/usemap und zu dem auch noch kleiner war?????
>Du kannst immer nur eine komplette Grafik ersetzen. Eine Imagemap ist
>immer noch nur *eine* Grafik, auch wenn mehrere Areas definiert wurden.
>Und mit Grafiken in verschiedenen Größen hat mindestens Netscape noch
>arge Probleme...
>
O.k., ich hab verstanden, dass ein Groessenwechsel Probleme mit sich
bringt, aber um eine komplette Grafik (kein usemap) per onclick durch
ein Bild gleicher groesse (jetzt usemap) zu ersetzen, benutze ich :
<script ....>
menu1on = new Image();
menu1on.src = "bild1.gif"; //kein usemap
menu1off = new Image();
menu1off.src = "bild2.gif"; //usemap, aber wie bringe ich
JavaScript bei, dass da noch
AREAs dazukommen?
function img_act(imgName)
{
document[imgName].src = eval(imgName + "on.src");
}
</script>
<body>
<A HREF="#" onClick="img_act('menu1')"><IMG SRC="bild1.gif"
NAME="menu1"></A>
</body>
Also wie bringe ich das JavaScript bei?
Viel Spass
Julian alias problem-child ~:-o
Hajo Pflueger
> function img_act(imgName)
> {
> document[imgName].src = eval(imgName + "on.src");
> }
document[imgName] ist in jedem Fall falsch. Ich denke, es sollte
document.images[imgName] sein, auf jeden Fall funktioniert das mit der
imgNr.
Julian Bessenroth
wrote:
>Hi,
>
>> function img_act(imgName)
>> {
>> document[imgName].src = eval(imgName + "on.src");
>> }
>
>document[imgName] ist in jedem Fall falsch. Ich denke, es sollte
>document.images[imgName] sein, auf jeden Fall funktioniert das mit der
>imgNr.
Das mit document[imgName] funzt prima, wenn die uebergebene Variable
ein 'String' ist.
<A HREF="#" onClick="img_act('menu1')"><IMG SRC="bild1.gif"
NAME="menu1"></A>
Mit [imgName] = 'menu1'(Name von <a>-Tag) spreche ich doch direkt den
Link an.
Hab ich gerade in einen JavaScript-Buch gelesen. Das Script an sich
funzt ja als onMouseOver-Script-zum-Bild-wechseln wie gesagt prima.
Das Problem war nur die Sache mir Bildwechsel ["normales" Bild -->
usemap Bild und wie ich JavaScript die AREAs beibringe].
menu1on = new Image();
menu1on.src = "bild1.gif"; //kein usemap
menu1off = new Image();
menu1off.src = "bild2.gif"; //usemap, aber wie bringe ich
JavaScript bei, dass da noch
AREAs dazukommen?
Bsp.: +-------------------+ +-----------+-------+
| | onClick | etc. | AREA1 |
| | -----> | +-------+
| | -----> +-----------+ |
| | | AREA2 | etc. |
+-------------------+ +-----------+-------+
menu1off = new Image();
menu1off.src = "bild2.gif",usemap="#abc"; //usemap???
<map>
<area....>
....
</map>
Wie gesagt das ist mein Problem und ich habe keine Ahnung!
greetings from problem-child ;'( schief
Hajo Pflueger
> Bsp.: +-------------------+ +-----------+-------+
> | | onClick | etc. | AREA1 |
> | | -----> | +-------+
> | | -----> +-----------+ |
> | | | AREA2 | etc. |
> +-------------------+ +-----------+-------+
ah, jetzt, ja...
Hoppla, interessante Problematik. Spontan wüßte ich nicht, wie man das
"sauber" hinbekommt. Du kannst es aber von Anfang an als Imagemap
programmieren, wobei Du <area href=javascript:link(1)> usw. schreibst.
onClick setzt Du dann eine Variable, mittels der die Funktion link(x)
entweder die Grafik als eins oder als Imagemap behandelt.
Ne andere Idee habe ich leider nicht...
Julian Bessenroth
wrote:
>
>ah, jetzt, ja...
>
>Hoppla, interessante Problematik. Spontan wüßte ich nicht, wie man das
>"sauber" hinbekommt. Du kannst es aber von Anfang an als Imagemap
>programmieren, wobei Du <area href=javascript:link(1)> usw. schreibst.
>onClick setzt Du dann eine Variable, mittels der die Funktion link(x)
>entweder die Grafik als eins oder als Imagemap behandelt.
>
O.k., wenn ich Dich richtig verstanden habe, dann habe ich fuer beide
Bilder die gleichen AREAs, nur mir dem Unterschied, dass ich sie nur
bei der zweiten Grafik abfrage, richtig? Aber wenn das so ict bleibt
nur noch ein Problem : Die Bilder werden ja weiterhin ueber JS
getauscht, aber wie (KODE-Beispiel-Ansatz bitte) definiere ich das
Bild bzw. beide Bilder zu USEMAPs?
Oder anderer Ansatz : Gibt es eine Moeglichkeit, dass ich nur
innerhalb eines Bildes die MouseKoordinaten abfrage bzw. dass die
Koordinaten an der linken oberen Ecke des Bildes bei null anfangen zu
zaehlen.
0
0 +--------------------------+
| bx=0 | So das ich mir selbst meine
| by=0+-bild--+ | Koordinaten ueber JS setze.
| | | |
| +-------+ by=20 |
| bx=10 |
+--------------------------+ 50
100
Viel Spass and TIA
problem-child :-)
Hajo Pflueger
> O.k., wenn ich Dich richtig verstanden habe, dann habe ich fuer beide
> Bilder die gleichen AREAs, nur mir dem Unterschied, dass ich sie nur
> bei der zweiten Grafik abfrage, richtig? Aber wenn das so ict bleibt
> nur noch ein Problem : Die Bilder werden ja weiterhin ueber JS
> getauscht, aber wie (KODE-Beispiel-Ansatz bitte) definiere ich das
> Bild bzw. beide Bilder zu USEMAPs?
nicht ganz. Die Imagemap liegt über beiden Bildern (ist ja nur ein Bild,
aber mit zwei verschiedenen Quellen). Die Imagemap ist auch immer die
gleiche, nämlich:
<area href=javascript:link(1)>
<area href=javascript:link(2)>
<area href=javascript:link(3)>
usw.
In der Funktion link(x) prüfst Du nur, ob gerade die Imagemap beachtet
werden soll oder nicht. Im einen Fall verlinkst Du immer auf die selbe
Seite, im anderen Fall verlinkst Du in Abhängigkeit vom übergebenen
Parameter x.
> Oder anderer Ansatz : Gibt es eine Moeglichkeit, dass ich nur
> innerhalb eines Bildes die MouseKoordinaten abfrage bzw. dass die
> Koordinaten an der linken oberen Ecke des Bildes bei null anfangen zu
> zaehlen.
Wenn Du ein Formular drumrumsetzt und <input type=image> benutzt, wird
die Position als "x" und "y" übergeben. Ich habe aber noch nie versucht,
damit ein JavaScript zu starten, kann Dir also bei der Auswertung nicht
helfen. Obige Methode ist aber im Grunde kein großes Problem, denke ich,
vielleicht vresuchst Du es erst mal damit.
Wolfgang Schwarz
Hajo Pflueger wrote:
> > Oder anderer Ansatz : Gibt es eine Moeglichkeit, dass ich nur
> > innerhalb eines Bildes die MouseKoordinaten abfrage bzw. dass die
> > Koordinaten an der linken oberen Ecke des Bildes bei null anfangen zu
> > zaehlen.
>
> Wenn Du ein Formular drumrumsetzt und <input type=image> benutzt, wird
> die Position als "x" und "y" übergeben. Ich habe aber noch nie versucht,
> damit ein JavaScript zu starten, kann Dir also bei der Auswertung nicht
> helfen. Obige Methode ist aber im Grunde kein großes Problem, denke ich,
> vielleicht vresuchst Du es erst mal damit.
wirklich? interessant. Ich dachte, nur ismap macht das automatisch.
hab vor einiger Zeit damit mal eine lustige Koordinaten-Abfrage
gebastelt. Weil ismap als server-side Geschichte relativ unbekannt
ist, poste ich mal die ganzen Dateien zum Ausprobieren:
ein normales Frameset:
<HTML><HEAD><TITLE></TITLE></HEAD><FRAMESET rows="100%,*">
<frame src="img.htm">
<frame src="dummi.htm" name="dummi">
</FRAMESET></HTML>
eine normale Datei img.htm:
<HTML><HEAD><TITLE></TITLE></HEAD><BODY>
...
<A HREF="dummi.htm" TARGET="dummi"><IMG SRC="Bild.jpg" ISMAP></A>
...
</BODY></HTML>
und Datei dummi.htm:
<HTML><HEAD><TITLE></TITLE>
<SCRIPT LANGUAGE="JavaScript">
<!--
coordy=null; coordx=null;
function coorz() {
str = location.search;
if (str != "") {
c = str.indexOf(",");
coordx = str.substring(1,c);
coordy = str.substring(c+1, str.length);
alert("x: "+coordx+", y: "+coordy);
}
}
//-->
</SCRIPT>
</HEAD>
<BODY onload="coorz()"></BODY>
</HTML>
Wolfgang.
--
homepage: http://www.wald.org/wolfgang
"Das Meer ist voll Wasser. Das soll einer verstehen." (Eric Satie)
Julian Bessenroth
wrote:
>
>nicht ganz. Die Imagemap liegt über beiden Bildern (ist ja nur ein Bild,
>aber mit zwei verschiedenen Quellen). Die Imagemap ist auch immer die
>gleiche, nämlich:
><area href=javascript:link(1)>
><area href=javascript:link(2)>
><area href=javascript:link(3)>
>usw.
>In der Funktion link(x) prüfst Du nur, ob gerade die Imagemap beachtet
>werden soll oder nicht. Im einen Fall verlinkst Du immer auf die selbe
>Seite, im anderen Fall verlinkst Du in Abhängigkeit vom übergebenen
>Parameter x.
>
Hey, ihr muesst mich langsam fuer doof halten, aber ich blicke da
nicht ganz durch!
per
Bild1[ohne MAP zu brnutzen]--->onClick--->Bild2[mit MAP zu benutzen]
1. wie ordne ich beim Bildwechsel/ueberhaupt unter JS dem Bild
eine Map zu (altes Problem)
menu1on = new Image();
menu1on.src = "bild1.gif";<---+
menu1off = new Image(); +--Verweis auf Map-Definition???
menu1off.src = "bild2.gif";<--+
Schliesslich kann ich erst dann mit
<area href=javascript:link(1)> auf die Links zugreifen.
Viel Spass
problem-child ~:-| totally confused
Hajo Pflueger
> Hey, ihr muesst mich langsam fuer doof halten, aber ich blicke da
> nicht ganz durch!
könnte passieren *g* :-)
Ne, manchmal sieht man einfach den Wald vor lauter Bäumen nicht. Ich
kenne das auch, also keine Sorge :-)
> per
> Bild1[ohne MAP zu brnutzen]--->onClick--->Bild2[mit MAP zu benutzen]
> 1. wie ordne ich beim Bildwechsel/ueberhaupt unter JS dem Bild
> eine Map zu (altes Problem)
> menu1on = new Image();
> menu1on.src = "bild1.gif";<---+
> menu1off = new Image(); +--Verweis auf Map-Definition???
> menu1off.src = "bild2.gif";<--+
> Schliesslich kann ich erst dann mit
> <area href=javascript:link(1)> auf die Links zugreifen.
Mit menu1on = new Image() hast Du die Grafik noch längst nicht auf dem
Bildschirm. Dazu definierst Du sie ganz einfach mit
<img src=bild1.gif usemap=#meineUseMap>
und schreibst dazu die Imagemap mit den beschriebenen Areas. Alles
andere ist ein wenig JavaScript, nämlich:
- Zustand speichern,
- bei Aufruf Bildwechsel,
- je nach Zustand location.href ändern.
Wird's langsam heller? :-)
Julian Bessenroth
wrote:
>Ne, manchmal sieht man einfach den Wald vor lauter Bäumen nicht.
>Wird's langsam heller? :-)
>
Aaaahhhhh...., eine Lichtung, na klar! So viel zu Wald und Baeumen.
Ich hab mich wohl zu sehr auf das Script beschrAEnkt.
O.k., TNX fuer Deine Geduld!!!
Ich nehm jetzt ein Sonnenbad auf meiner Lichtung B-))), und werde mich
mal mit der "ganzen" Seite (nicht nur dem Script) befassen.
CU
Viel Spass
problem-child
Julian Bessenroth
<wsch...@zedat.fu-berlin.de> wrote:
>wirklich? interessant. Ich dachte, nur ismap macht das automatisch.
>hab vor einiger Zeit damit mal eine lustige Koordinaten-Abfrage
>gebastelt. Weil ismap als server-side Geschichte relativ unbekannt
>ist, poste ich mal die ganzen Dateien zum Ausprobieren:
Hey,
auch vielen Dank an Dich. Ich glaub ich bin des Raetsels Antwort auf
die Schliche gekommen.
Georg Maaß
> Ich will ein ganz normales gif-Bild per meuseOver oder meinetwegen
> auch ueber onClick durch ein anderes ersetzen, was ja bis hierher ganz
> einfach ist, aber das ersetzte Gif soll ein imagemap/usemap sein.
> Wie definiere ich dann aber die einzelnen areas, wenn das vorherige
> Bild kein imagemap/usemap und zu dem auch noch kleiner war?????
> (enschuldigt die klemmende Taste, aber ich bin ratlos).
>
Das geht nicht ohne Neuzeichnen des Dokuments, wobei das neu zu zeichnende
Dokument z.B. ein Layer sein kann.
Der Grund dafür liegt im Image-Objekt. Es kennt laut dem Buch von
Stefan Mintert nur folgende Eigenschaften: border, complete,
height, hspace, lowsrc, name, src vspace und width. Es kennt auch
keine Funktionen. Es kennt aber leider keine imagemap-Eigenschaft,
die es Dir ermöglichte per JavaScript das Image-Map ein- und
auszuschalten bzw. auf ein anderes Image-Map zu wechseln. Du kannst das
Image-Map derzeit nur über den IMG-Tag spezifizieren. Dies bedeutet
aber, daß der Browser den IMG-Tag neu rendern muß. Dazu mußt Du
entweder das ganze Dokument oder zumindest das Layer mit dem IMG-Tag
neuzeichnen lassen.
Eine andere Lösung fällt mir zu Deinem Problem nicht ein. In einem
einfachen Spezialfall ist auf folgender Workaround denkbar, bei welchem
aber nicht das Image-Map gewechselt wird, sondern lediglich das
Verhalten des Image-Map sich ändert:
Ab Netscape 4.0 unterstützt der AREA-Tag auch onClick-Events, damit
könntest Du die Maus-Klicks abfangen und in Abhängigkeit vom jeweils
aktuellen Image.src mal dahin mal dorthin leiten, d.h. das Image wird
von vorneherein als Image mit Image-Map angelegt, wobei sich lediglich
das Verhalten der Image-Map der aktuellen Situation anpaßt, d.h. in
Abhängigkeit vom Image.src alle Klicks zur selben URL schickt, oder
aber in jedem Area zu einer anderen.
Eine Änderung der Image-Map ist jedenfalls derzeit nur durch Neurendern
des IMG-Tags möglich.
Verwechsle nicht das Bild-Objekt mit der URL. Wenn Du dem Image.src
eine neue URL zuweist, ändert sich gegebenenfalls das Aussehen des
Bild-Objekts. Da Bild-Objekt bleibt aber das selbe. Lediglich die URL
und das, was im Visualisierungsbereich dieses Bildobjekst im Fenster
befindet, verändert sich. Das Bild[-Objekt] bleibt aber dasselbe, d.h
all die Eigenschaften, die Du nicht änderst, bleiben ebenfalls unverändert.
----------------------------------------------------------------------
Georg Maaß mailto:georg...@gmx.de
Hertzstraße 180a http://members.xoom.com/NF37ao0OujKw/
D-76187 Karlruhe http://privat.schlund.de/Georg-Maass/
----------------------------------------------------------------------