Witam, pracuje nad pewnym dosyc sporym skryptem a w zasadzie pracowalem bo go juz skonczylem :) tylko ze dopiero po skonczeniu go dotarlo do mnie ze nie kazdy ma taka sama rozdzielczosc co ja a caly skrypt jest oparty o konkretne piksele i tu mam problem. Udalo mi sie skrypt na tyle przerobic ze wystarczy pobrac tylko pozycje x,y danego obrazka i juz wszystko bedzie dzialac bez problemow, tylko ze w tym tkwi moj problem. mam tabele width = 100% podzielona na piec td width = 20%, teraz w kazdym td mam obrazek no i w jaki sposob mam pobrac jego pozycje x,y w px?
Probowalem napisac skrypt ktory by mi nalozyl na siebie 2 obrazki celu znalezienie jakiegos rozwiazanie mojego problemu, napisalem to w taki sposob:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
<title>Dokument bez nazwy</title>
<SCRIPT LANGUAGE = "JavaScript">
var wx;
var wy;
var tabx, taby, tx, ty, ox, oy;
function sprawdz()
{
tabx = document.getElementById('tab').offsetLeft;
taby = document.getElementById('tab').offsetTop;
tx = document.getElementById('t0').offsetLeft;
ty = document.getElementById('t0').offsetTop;
ox = document.getElementById('ob').offsetLeft;
oy = document.getElementById('ob').offsetTop;
wx = tabx + tx + ox;
wy = taby + ty + oy;
document.getElementById('tekst').innerHTML = 'wx='+wx+' wy='+wy+' tabx='+tabx+' taby='+taby+' tx='+tx+' ty='+ty+' ox='+ox+' oy='+oy;
document.getElementById('ob1').style.left = wx;
document.getElementById('ob1').style.top = wy;
}
</SCRIPT>
</head>
<body>
<table id="tab" width="100%" border="0">
<tr>
<td id="t0" width="20%"><div align="center"><img src="tlo.JPG" name="ob" width="100" height="28" id="ob"/></div></td>
<td id="t1" width="20%"><div align="center"></div></td>
<td id="t2" width="20%"><div align="center"></div></td>
<td id="t3" width="20%"><div align="center"></div></td>
<td id="t4" width="20%"><div align="center"></div></td>
</tr>
</table>
<img id="ob1" src="tlo.JPG" style="position:absolute; top:200px; left:0px; width:100px; height:28px;"/>
<p onclick="sprawdz()">Kliknij</p>
<p id="tekst">sardrasd</p>
</body>
</html>
No i w firefoxie obrazka mi nie przesuwa, natomiast w IE przesuwa ale nie nakladaja sie, poza tym wynik poszczegolnych zmiennych w Firefoxie i IE sa rozne od siebie. Prosze o pomoc jak sobie z tym poradzic.