Position eines IMG im Fenster
Michael Rolli
- dhtml
0 Joachim0 Michael0 Michael Rolli0 Joachim
Hallo zusammen,
ich möchte mit folgendem Skript eine Ebene ein und ausblenden, welches sich exakt auf ein Bild legt. Ebene und Bild sind exakt gleich gross. Wie kann ich die Position in x,y des Bildes auf der Seite herausfinden? Das Bild ist nicht auf jeder Seite an der gleichen Stelle. Also ein Roll-Over-Effekt, wobei die Ebene nur Text enthalten wird (und eben kein Bild).
<html>
<head>
<title>show/hide test</title>
<script language='JavaScript'>
<!--
function changevis(ebene,aktion)
{
if (document.getElementById) { x = document.getElementById(ebene).style }; // NN6,IE5
if (document.all) { x = document.all[ebene].style }; //IE4
if (document.layers) { x = document.layers[ebene] }; //NN4x
if (aktion == "ein") { x.visibility = "visible"}; // einblenden
if (aktion == "aus") { x.visibility = "hidden" }; // ausblenden
}
// -->
</script>
<link rel="stylesheet" href="style.css" type="text/css">
</head>
<body bgcolor="#ffffff" text="#000000" link="#ff0000" vlink="#800000" alink="#ff00ff">
<div id="content"><img src="text.gif" width="600px" height="500px"></div>
<p>
<img src="bild.jpg" width="600px" height="500px">
Link <a href="javascript:changevis('content','ein')">einblenden</a> oder <a href="javascript:changevis('content','aus')">ausblenden</a>.
</p>
</body>
</html>
Danke für die Hilfe.
Michael
hi,
wenn das bild _nicht_ in positionierbaren Elementen steckt:
// ab js1.2
function findPos(el) {
var xPos = 0;
var yPos = 0;
if(document.layers) {
xPos = el.x;
yPos = el.y;
}
else {
while(el){
xPos += el.offsetLeft;
yPos += el.offsetTop;
el = el.offsetParent;
}
}
return {xPos: xPos, yPos: yPos};
}
gib dem Bild einen Namen. Position findest Du dann so heraus
var x = findPos('document.bildname').xPos;
var y = findPos('document.bildname').yPos;
hth
Gruesse Joachim
Vielen Dank Joachim,
ich werd's gleich mal probieren. Ich hoffe, es funzt sowohl in NN4+6 als auch IE4+5, sonst heisst's basteln.
Nochmals Danke und bis denne
Michael
Hi Joachim,
Dein Skript ist genau, was ich gsucht habe. Wusste gar nicht, dass ein <img> auch ein attribut offsetTop etc. hat. Bequem so.
Zu Deinem Skript. Irgend etwas stimmt noch nicht und zwar in folgendem Teil:
if(document.layers) {
xPos = el.x;
yPos = el.y;
}
else {
while(el){
xPos += el.offsetLeft;
yPos += el.offsetTop;
el = el.offsetParent;
}
wenn ich xPos = document.bild.x; versuche klappt's.
wenn ich's mit xPos = el.x; versuche klappt's nicht (undefined resp. NaN)
Übergabe an finPos: x = findPos('document.bild').xPos;
ein alert(el) im if(doc... offenbart aber korrekt: document.bild
Woran das wohl liegt? Gleiches Problem für IE4+5 und NN6 Teil.
Viele Grüsse
Michael
hi,
Übergabe an finPos: x = findPos('document.bild').xPos;
ups, sorry, keinen String sondern ein object uebergeben, also
x = findPos(document.bild).xPos;
kleiner, feiner Unterschied ;-)
hth
Gruesse Joachim