ciao ragazzi avrei bisogno del vostro aiuto!!! ho un div con una scrollbar e all'interno c'è una tabella con quaranta campi text.vorrei sapere come faccio a sapere la posizone effettiva di uno di questi campi che (le coordinate)varia al movimento della scrollbar.in pratica schiacciando un tasto mi dovrebbe comparire l'alert che mi dice di quanto ho scrollato uno dei campi text.aspetto con ansia una risposta!!!vi posto il codice che non funziona correttamente!!
<html>
<head>
<title>tabella</title>
<SCRIPT type="text/javascript">
function provaX(){
var vDoc=(document.documentElement && document.documentElement.clientWidth)?document.doc umentElement:document.body;
var scrX=(window.scrollX)?window.scrollX:vDoc.scrollLe ft;
var scrY=(window.scrollY)?window.scrollY:vDoc.scrollTo p;
alert(scrX);
}
function provaY(){
var vDoc=(document.documentElement && document.documentElement.clientWidth)?document.doc umentElement:document.body;
var scrX=(window.scrollX)?window.scrollX:vDoc.scrollLe ft;
var scrY=(window.scrollY)?window.scrollY:vDoc.scrollTo p;
alert(scrY);
}
function getPosX(obj) {
var curleft = 0;
if (obj.offsetParent) {
while (obj.offsetParent) {
curleft += obj.offsetLeft
obj = obj.offsetParent;
}
}
else if (obj.x)
curleft += obj.x;
alert(curleft);
return curleft;
}
function getPosY(obj) {
var curtop = 0;
if (obj.offsetParent) {
while (obj.offsetParent) {
curtop += obj.offsetTop
obj = obj.offsetParent;
}
}
else if (obj.y)
curtop += obj.y;
alert(curtop);
return curtop;
}
function saluta() {
txtUno=document.uno.txtUno.value;
txtQuattro=document.uno.txtQuattro.value;
alert("HAI SCRITTO="+" "+txtQuattro);
}
</script>
</head>
<body>
<form name="uno" action="">
<center><div id="pippo" style="width:450px;height:80px; overflow-x:scroll; overflow-y:scroll;border:1px solid black;">
<table cellpadding="4" cellspacing="1" width="120%" border=0>
<tr>
<td width=20%><input type="text" id="txtuno">
</td>
</tr>
<tr>
<td width=20%><input type="text" name="txtuno">
</td>
</tr>
<tr>
<td width=20%><input type="text" name="txtuno">
</td>
</tr>
<tr>
<td width=20%><input type="text" id="txtuno">
</td>
</tr>
</div>
<tr>
<td width=20%><input type="text" name="5">
</td>
</tr>
<tr>
<td width=20%><input type="text" name="6">
</td>
</tr>
<tr>
<td width=20%><input type="text" name="7">
</td>
</tr>
<tr>
<td width=20%><input type="text" name="8">
</td>
</tr>
<tr>
<td width=20%><input type="text" name="9">
</td>
</tr>
<tr>
<td width=20%><input type="text" name="10">
</td>
</tr>
<tr>
<td width=20%><input type="text" name="11">
</td>
</tr>
<tr>
<td width=20%><input type="text" name="12">
</td>
</tr>
<tr>
<td width=20%><input type="text" name="13">
</td>
</tr>
<tr>
<td width=20%><input type="text" name="14">
</td>
</tr>
<tr>
<td width=20%><input type="text" name="15">
</td>
</tr>
<tr>
<td width=20%><input type="text" name="16">
</td>
</tr>
<tr>
<td width=20%><input type="text" name="17">
</td>
</tr>
<tr>
<td width=20%><input type="text" name="18">
</td>
</tr>
<tr>
<td width=20%><input type="text" name="19">
</td>
</tr>
<tr>
<td width=20%><input type="text" name="20">
</td>
</tr>
<tr>
<td width=20%><input type="text" name="21">
</td>
</tr>
<tr>
<td width=20%><input type="text" name="22">
</td>
</tr>
<tr>
<td width=20%><input type="text" name="23">
</td>
</tr>
<tr>
<td width=20%><input type="text" name="24">
</td>
</tr>
<tr>
<td width=20%><input type="text" name="25">
</td>
</tr>
<tr>
<td width=20%><input type="text" name="26">
</td>
</tr>
<tr>
<td width=20%><input type="text" name="27">
</td>
</tr>
<tr>
<td width=20%><input type="text" name="28">
</td>
</tr>
<tr>
<td width=20%><input type="text" name="29">
</td>
</tr>
<tr>
<td width=20%><input type="text" name="30">
</td>
</tr>
<tr>
<td width=20%><input type="text" name="31">
</td>
</tr>
<tr>
<td width=20%><input type="text" name="32">
</td>
</tr>
<tr>
<td width=20%><input type="text" name="33">
</td>
</tr>
<tr>
<td width=20%><input type="text" name="34">
</td>
</tr>
<tr>
<td width=20%><input type="text" name="35">
</td>
</tr>
<tr>
<td width=20%><input type="text" name="36">
</td>
</tr>
<tr>
<td width=20%><input type="text" name="37">
</td>
</tr>
<tr>
<td width=20%><input type="text" name="38">
</td>
</tr>
<tr>
<td width=20%><input type="text" name="39">
</td>
</tr>
<tr>
<td width=20%><input type="text" name="40">
</td>
</tr>
</table>
</center>
</form>
</div>
<center>
<form action="">
<htmlelement id="txtuno" name="" onscroll="prova();">
<input type="button" value="txtuno" onclick="javascript:getPosX(document.getElementByI d('txtuno'));javascript:getPosY(document.getElemen tById('txtuno'));" >
<input type="button" value="txtuno" onclick="javascript:getPosX(document.getElementByI d('txtuno'));javascript:getPosY(document.getElemen tById('txtuno'));" >
<input type="button" value="txtuno" onclick="javascriptrovaX(document.getElementById('txtquattro'));javas cript
rovaY(document.getElementById('txtquattro'));" >
</form>
</center>
</body>
</html>