Javascript-форум (https://javascript.ru/forum/)
-   Элементы интерфейса (https://javascript.ru/forum/dom-window/)
-   -   прокрутка таблицы (https://javascript.ru/forum/dom-window/4893-prokrutka-tablicy.html)

cuberboy 28.08.2009 00:42

прокрутка таблицы
 
<html>




<link rel="stylesheet" type="text/css" href="../style/style.css">
<body bgcolor="white">




<div style="width:100%;background:red;overflow:hidden;" id="divtab" onMousemove="q(event)">

<table border=1 style="position:relative;"  id="tab" ><tr>
<form action=mag2.php?mag=8 method=post>
<td width=100px><center>
<a href="mag1.php?mag=8&tovar=161" target="mag1">
<img src="../fotosize.php?ris=161&size=1" lowsrc="loader.gif" width=90>
</a>
<b>0.00</b>
<input type="checkbox" name=161  />
</td>
<td width=100px><center>
<a href="mag1.php?mag=8&tovar=162" target="mag1">
<img src="../fotosize.php?ris=162&size=1" lowsrc="loader.gif" width=90>
</a>
<b>0.00</b>
<input type="checkbox" name=162  />
</td>
<td width=100px><center>
<a href="mag1.php?mag=8&tovar=163" target="mag1">
<img src="../fotosize.php?ris=163&size=1" lowsrc="loader.gif" width=90>
</a>
<b>0.00</b>
<input type="checkbox" name=163  />
</td>
<td width=100px><center>
<a href="mag1.php?mag=8&tovar=164" target="mag1">
<img src="../fotosize.php?ris=164&size=1" lowsrc="loader.gif" width=90>
</a>
<b>0.00</b>
<input type="checkbox" name=164  />
</td>
<td width=100px><center>
<a href="mag1.php?mag=8&tovar=165" target="mag1">
<img src="../fotosize.php?ris=165&size=1" lowsrc="loader.gif" width=90>
</a>
<b>0.00</b>
<input type="checkbox" name=165  />
</td>
<td width=100px><center>
<a href="mag1.php?mag=8&tovar=166" target="mag1">
<img src="../fotosize.php?ris=166&size=1" lowsrc="loader.gif" width=90>
</a>
<b>0.00</b>
<input type="checkbox" name=166  />
</td>
<td width=100px><center>
<a href="mag1.php?mag=8&tovar=167" target="mag1">
<img src="../fotosize.php?ris=167&size=1" lowsrc="loader.gif" width=90>
</a>
<b>0.00</b>
<input type="checkbox" name=167  />
</td>
<td width=100px><center>
<a href="mag1.php?mag=8&tovar=168" target="mag1">
<img src="../fotosize.php?ris=168&size=1" lowsrc="loader.gif" width=90>
</a>
<b>0.00</b>
<input type="checkbox" name=168  />
</td>
<td width=100px><center>
<a href="mag1.php?mag=8&tovar=169" target="mag1">
<img src="../fotosize.php?ris=169&size=1" lowsrc="loader.gif" width=90>
</a>
<b>0.00</b>
<input type="checkbox" name=169  />
</td>
<td width=100px><center>
<a href="mag1.php?mag=8&tovar=170" target="mag1">
<img src="../fotosize.php?ris=170&size=1" lowsrc="loader.gif" width=90>
</a>
<b>0.00</b>
<input type="checkbox" name=170  />
</td>
<td width=100px><center>
<a href="mag1.php?mag=8&tovar=171" target="mag1">
<img src="../fotosize.php?ris=171&size=1" lowsrc="loader.gif" width=90>
</a>
<b>0.00</b>
<input type="checkbox" name=171  />
</td>
<td width=100px><center>
<a href="mag1.php?mag=8&tovar=172" target="mag1">
<img src="../fotosize.php?ris=172&size=1" lowsrc="loader.gif" width=90>
</a>
<b>0.00</b>
<input type="checkbox" name=172  />
</td>
<td width=100px><center>
<a href="mag1.php?mag=8&tovar=173" target="mag1">
<img src="../fotosize.php?ris=173&size=1" lowsrc="loader.gif" width=90>
</a>
<b>0.00</b>
<input type="checkbox" name=173  />
</td>
<td width=100px><center>
<a href="mag1.php?mag=8&tovar=174" target="mag1">
<img src="../fotosize.php?ris=174&size=1" lowsrc="loader.gif" width=90>
</a>
<b>0.00</b>
<input type="checkbox" name=174  />
</td>
<td width=100px><center>
<a href="mag1.php?mag=8&tovar=175" target="mag1">
<img src="../fotosize.php?ris=175&size=1" lowsrc="loader.gif" width=90>
</a>
<b>0.00</b>
<input type="checkbox" name=175  />
</td>
<td width=100px><center>
<a href="mag1.php?mag=8&tovar=176" target="mag1">
<img src="../fotosize.php?ris=176&size=1" lowsrc="loader.gif" width=90>
</a>
<b>0.00</b>
<input type="checkbox" name=176  />
</td>
<td width=100px><center>
<a href="mag1.php?mag=8&tovar=177" target="mag1">
<img src="../fotosize.php?ris=177&size=1" lowsrc="loader.gif" width=90>
</a>
<b>0.00</b>
<input type="checkbox" name=177  />
</td>
<td width=100px><center>
<a href="mag1.php?mag=8&tovar=178" target="mag1">
<img src="../fotosize.php?ris=178&size=1" lowsrc="loader.gif" width=90>
</a>
<b>0.00</b>
<input type="checkbox" name=178  />
</td>
<td width=100px><center>
<a href="mag1.php?mag=8&tovar=179" target="mag1">
<img src="../fotosize.php?ris=179&size=1" lowsrc="loader.gif" width=90>
</a>
<b>0.00</b>
<input type="checkbox" name=179  />
</td>
<td width=100px><center>
<a href="mag1.php?mag=8&tovar=180" target="mag1">
<img src="../fotosize.php?ris=180&size=1" lowsrc="loader.gif" width=90>
</a>
<b>0.00</b>
<input type="checkbox" name=180  />
</td>
<td><input type=image src="" width=90 alt="В корзину"></a></td>
</tr></table>
</div>
<input id="cursor">
<input id="shirina">
<input id="proc">
<script>
function q(e){
document.all.cursor.value=e.clientX;
document.all.shirina.value=document.body.offsetWidth;
w=e.clientX/document.body.offsetWidth*100;
document.all.proc.value=w;
document.all.tab.style.left="-"+w+"%";
//document.all.tab.style.left="-90%";
}

</script>
</body>
</html>

и что то непонятное просиходит......

cuberboy 28.08.2009 01:12

коордитната ХЭ<input id="cursor"><br>
Ширина Документа<input id="shirina"><br>
Оношение<input id="proc"><br>
Ширина таблицы<input id="shirTab">
<script>
function q(e){
shirinaD=document.body.offsetWidth;
shirinaT=document.all.tab.offsetWidth;
kursor=e.clientX;

proc1=kursor/shirinaD;

document.all.cursor.value=kursor;
document.all.shirina.value=shirinaD;

document.all.shirTab.value=shirinaT;

document.all.proc.value=proc1*100+"%";
//document.all.tab.style.left="-"+w*tt+"%";
document.all.tab.style.left=(shirinaD-shirinaT)*proc1;
}

</script>

вот так заработало - мотатет, криво тока чуть чуть на предельных значениях


Часовой пояс GMT +3, время: 22:08.