nicht angemeldet
Div Positionierung bei dynamischen Bild übernehmen?
Hallo,
ich hab leider ein kleines Problem: Ich habe auf meiner HP mit hilfe von "<div style="position:absolut ... usw. eine Grafik an eine Feste position gerückt und dann als link bestimmt. Nun wollte ich per Java und OnMouseOver etc. dynamische Buttons draus machen, soll heißen beim drüber fahren verändert sich das Bild bzw. wird ja nur durch ein anderes ersetzt. Wenn ich aber das Script aus SelfHTML nehme, übernimmt der nicht die Koordinaten des "<div>" befehls und klatscht das Bild in dem Frame vorne ran...was natürlich etwas unpraktisch ist ;-). Gibt es da ne möglichkeit?
-
Du solltest das betreffende Stück Quellcode mal mitschicken.
Gruss_marcus
-
Du solltest das betreffende Stück Quellcode mal mitschicken.
Gruss_marcus
<html>
<head>
<title>=A= Föderation =A=</title>
<link rel="Stylesheet" type="text/css" href="../../css/tabelle.css">
<script type="text/javascript">
<!--
Normal1 = new Image();
Normal1.src = "wer.gif"; /* erste Standard-Grafik */
Highlight1 = new Image();
Highlight1.src = "werueb.gif"; /* erste Highlight-Grafik */function Bildwechsel(Bildnr,Bildobjekt) {
window.document.images[Bildnr].src = Bildobjekt.src;
}
//-->
</script>
</head>
<body bgcolor="#000000" link="#000000" alink="#000000" vlink="#000000" text="#ffffff">
<table width="100%" height="100%" border="0" cellpadding =0 cellspacing=0 align="top">
<tr><td colspan="2"><img src="../pic/lctoplang.gif"><img src="../pic/ani.gif"><img src="../pic/lctoplang3.gif">
<div style="position:absolute; top:0px; left:103px; z-index:1;"><a href="http://galaxy-gate.de/"><img src="../pic/ggatelogo.jpg" height="80"></a></div></td></tr>
<tr><td colspan="2" align="top"><img src="../pic/lctoplang5.gif" align="top"><img src="../pic/lctoplang6.gif"><img src="../pic/lctoplang7.gif"></td></tr>
<TR><TD><-- Geht um den Bereich -->
<div style="position:absolute; top:2px; right:580px; z-index:1;"><a href="wer.htm" style="cursor:help" target="main" onMouseOver="Bildwechsel(0,Highlight1)" onMouseOut="Bildwechsel(0,Normal1)"><img src="wer.gif" ></a></div>
<-- Bereich Ende -->
<div style="position:absolute; top:28px; right:580px; z-index:1;"><a href="was.htm" style="cursor:help" target="main"><img src="was.gif"></a></div>
<div style="position:absolute; top:54px; right:580px; z-index:1;"><a href="ziele.htm" style=
"cursor:help" target="main"><img src="ziele.gif"style="cursor:help"></a></div><div style="position:absolute; top:2px; right:425px; z-index:1;"><a href="wie.htm" style="cursor:help"
target="main"><img src="wie.gif" style="cursor:help"></a></div><div style="position:absolute; top:28px; right:425px; z-index:1;"><a href="insrs.htm" style="cursor:help" target="main"><img src="insrs.gif" style="cursor:help"></a></div>
<div style="position:absolute; top:54px; right:425px; z-index:1;"><a href="softw.htm" style="cursor:help" target="main"><img src="softw.gif" style="cursor:help"></a></div>
</TD></TR>
</table>
</body>
</html>da...das ist die ganze Datei
-
Hi,
Du ordnest absolut positionierte DIVs in Tabellenzellen an.
Das kann nicht klappen.
Das nicht funktionierende Skript ist m.E. nur ein daraus resultierendes Problem, der Funktionsaufruf bekommt noch ein ";", aber das ist derzeit echt das wenigste. :)Gruß
_marcus
-
Hi,
Du ordnest absolut positionierte DIVs in Tabellenzellen an.
Das kann nicht klappen.Ähm, das anordnen Funktioniert aber...ich sehs ja ;-). Nur eben das mit dem Dynamischen bild nicht...
-
Ähm, das anordnen Funktioniert aber...ich sehs ja ;-). Nur eben das mit dem Dynamischen bild nicht...
Solange Du das Bild nicht als Objekt ansprichst wird es zwar dargestellt, ab dem Moment wo Du aber document.images[i] adressierst, kommt der Browser in seiner Objektverwaltung durch Deine verschachtelten TDs und DIVs völlig durcheinander und zeigt das Bild eben irgendwo an (im Zweifel ausserhalb aller TDs und DIVs).
-
Ähm, das anordnen Funktioniert aber...ich sehs ja ;-). Nur eben das mit dem Dynamischen bild nicht...
Solange Du das Bild nicht als Objekt ansprichst wird es zwar dargestellt, ab dem Moment wo Du aber document.images[i] adressierst, kommt der Browser in seiner Objektverwaltung durch Deine verschachtelten TDs und DIVs völlig durcheinander und zeigt das Bild eben irgendwo an (im Zweifel ausserhalb aller TDs und DIVs).
<html>
<head>
<title>=A= Föderation =A=</title>
<link rel="Stylesheet" type="text/css" href="../../css/tabelle.css">
<script type="text/javascript">
<!--
Normal1 = new Image();
Normal1.src = "wer.gif"; /* erste Standard-Grafik */
Highlight1 = new Image();
Highlight1.src = "werueb.gif"; /* erste Highlight-Grafik */function Bildwechsel(Bildnr,Bildobjekt) {
window.document.images[Bildnr].src = Bildobjekt.src;
};
//-->
</script>
</head>
<body bgcolor="#000000" link="#000000" alink="#000000" vlink="#000000" text="#ffffff">
<nobr><img src="../pic/lctoplang.gif"><img src="../pic/ani.gif"><img src="../pic/lctoplang3.gif"></nobr>
<div style="position:absolute; top:0px; left:103px; z-index:1;"><a href="http://galaxy-gate.de/"><img src="../pic/ggatelogo.jpg" height="80"></a></div>
<nobr><img src="../pic/lctoplang5.gif" align="top"><img src="../pic/lctoplang6.gif"><img src="../pic/lctoplang7.gif"></nobr><div style="position:absolute; top:2px; right:580px; z-index:1;"><a href="wer.htm" style="cursor:help" target="main" onMouseOver="Bildwechsel(0,Highlight1)" onMouseOut="Bildwechsel(0,Normal1)"><img src="wer.gif" ></a></div>
<div style="position:absolute; top:28px; right:580px; z-index:1;"><a href="was.htm" style="cursor:help" target="main"><img src="was.gif"></a></div>
<div style="position:absolute; top:54px; right:580px; z-index:1;"><a href="ziele.htm" style=
"cursor:help" target="main"><img src="ziele.gif"style="cursor:help"></a></div><div style="position:absolute; top:2px; right:425px; z-index:1;"><a href="wie.htm" style="cursor:help"
target="main"><img src="wie.gif" style="cursor:help"></a></div><div style="position:absolute; top:28px; right:425px; z-index:1;"><a href="insrs.htm" style="cursor:help" target="main"><img src="insrs.gif" style="cursor:help"></a></div>
<div style="position:absolute; top:54px; right:425px; z-index:1;"><a href="softw.htm" style="cursor:help" target="main"><img src="softw.gif" style="cursor:help"></a></div>
</body>
</html>hab es mal ohne die tabelle gemacht...selbst da funktioniert es nicht. Hab übrigens festgestellt, das er das nicht irgend wohin macht sondern sogar das erste Bild einfach ersetzt...
vieleicht kannste mir dann den Quelltext mal hier reinschreiben, der das Problem dann löst? Meine javascript kenntnisse sind nämlich eher gering ;-)
Marco
-
window.document.images[Bildnr].src = Bildobjekt.src
Du weisst einem bestimmten Bild in Deinem Dokument die Source von Bildobjekt zu. Bei Deinem Aufruf (0,Highlight1) ist das window.document.images[0], also das erste Bild das in Deinem Dokument vorkommt.
Also: Die Bilder durchzählen und in diesem Fall auf die Zahl 7 kommen:(7,Highlight1)
Gruß
_marcus-
window.document.images[Bildnr].src = Bildobjekt.src
Du weisst einem bestimmten Bild in Deinem Dokument die Source von Bildobjekt zu. Bei Deinem Aufruf (0,Highlight1) ist das window.document.images[0], also das erste Bild das in Deinem Dokument vorkommt.
Also: Die Bilder durchzählen und in diesem Fall auf die Zahl 7 kommen:(7,Highlight1)
Gruß
_marcusÄhm...ich glaube wir reden hier aneinander vorbei...das mit dem bildwechseln funktioniert ja...nur eben nicht so bzw. DORT wo es soll. Wenn ich mit der Maus auf das original Bild (wer.gif) fahre, erscheint das "alternative" bzw. "onmouseover" bild zwar (werueb.gif) allerding nicht an der selben Position sondern ganz links am Bildschirm rand. Was die Funktion Bildwechsel verursacht bzw. wie sie funktioniert ist mir schon klar...ich will nur, das er das Alternative Bild auch an der Selben position anzeigt, an der "wer.gif" auch ist! Das später bei allen der OnMouseOver Effekt gehen soll ist schon klar, aber ich wollte es erst mal bei dem einen zum laufen bringen...aber wie gesagt, er zeigt es nicht an der selben Position an...da hilft mir das nicht viel
-
AHH....jetzt hab ichs kapiert...ich zieh den Beitrag oben zurück und bedanke mich...brauch manchmal eben etwas länger ;-)
Marco
-
Kein Problem,
jetzt sitzt es! :)
-
-
-
-
-
-
-
-
Hallo,
Wir zählen mal:
<html>
...
<body bgcolor="#000000" link="#000000" alink="#000000" vlink="#000000" text="#ffffff">
<table width="100%" height="100%" border="0" cellpadding =0 cellspacing=0 align="top">
<tr><td colspan="2"><img src="../pic/lctoplang.gif"><img src="../pic/ani.gif"><img src="../pic/lctoplang3.gif">Bild[0],Bild[1],Bild[2],
<div style="position:absolute; top:0px; left:103px; z-index:1;"><a href="http://galaxy-gate.de/"><img src="../pic/ggatelogo.jpg" height="80"></a></div></td></tr>
Bild[3],
<tr><td colspan="2" align="top"><img src="../pic/lctoplang5.gif" align="top"><img src="../pic/lctoplang6.gif"><img src="../pic/lctoplang7.gif"></td></tr>
Bild[4],Bild[5],Bild[6],
<TR><TD>
<-- Geht um den Bereich -->
<div style="position:absolute; top:2px; right:580px; z-index:1;"><a href="wer.htm" style="cursor:help" target="main" onMouseOver="Bildwechsel(0,Highlight1)" onMouseOut="Bildwechsel(0,Normal1)"><img src="wer.gif" ></a></div>
Bild[7]
Welches Bild änderst Du? Richtig, Bild[0].viele Grüße
Axel
-
-