| |
|
|
| | Доброго дня знатоки, подскажите есть ли решение следующей задаче, я всегда думал что нет.
Есть таблица, верхний ряд которого нужно зафиксировать, чтобы он при вертикальной прокрутке и не смещался вверх. Можно сделать это c помощью
setframe
iframe, а как еще ??
Теперь задачу усложним: боковой столбец тоже не должен двигаться при горизонтальной прокрутке. Т.е. эффект закрепления области как в m$ Excell.
Можно ли как нибудь сделать такой эффект. Понятно что для печати нужно будет делать отдельную версию документа.
Заранее благодарен за любую информацию 8) | |
| |
|
|
| |
|
|
| |
для: msgipss
(12.07.2005 в 12:12)
| | | Подключаете к скрипту файл
<script src="../syncscroll.js"></script>
|
дальше
<script>
function ld()
{
var w = document.body.clientWidth - 32;
document.getElementById("div_root").style.width = w + "px";
document.getElementById("div_main").style.width = w + "px";
document.getElementById("div_up").style.width = (w - 16) + "px";
document.getElementById("div_root").style.display = "inline";
if (h_main == 0) h_main = div_main.offsetHeight;
var h = document.body.clientHeight - 100;
if (h < 190) h = 190;
if (h_main <= h) h = h_main;
document.getElementById("div_root").style.height = h + 16 + "px";
document.getElementById("div_main").style.height = h + 16 + "px";
document.getElementById("div_up").style.height = h + "px";
document.getElementById("div_left").style.height = h + "px";
}
</script>
<style type="text/css">
#div_root {
WIDTH: 525px;
HEIGHT: 516px;
display: none;
}
#div_main {
overflow: auto;
position: absolute;
z-index: 0;
WIDTH: 525px;
scrollbar-face-color: #b0e0e6;
}
#div_up {
overflow: hidden;
position: absolute;
z-index: 1;
WIDTH: 509px;
HEIGHT: 96px;
}
#div_left {
overflow: hidden;
position: absolute;
z-index: 1;
WIDTH: 190px;
HEIGHT: 500px;
}
#div_top{
position: absolute;
z-index: 2;
WIDTH: 142px;
HEIGHT: 96px;
}
</style>
<script language="JavaScript" type="text/javascript">
addScrollSynchronization(document.getElementById("div_up"), document.getElementById("div_main"), "horizontal");
addScrollSynchronization(document.getElementById("div_left"), document.getElementById("div_main"), "vertical");
h_main=0;
load_page();
</script>
|
div_root - общий div в котором содержатся все остальные div'ы
div_main - содержит в себе таблицу с контентом
div_up - div содержит таблицу с шапкой
div_left - содержит левую таблицу
div_top - стоит на пересечении левой таблицы и таблицы - шапки | |
| |
|
|
| |
|
|
| |
для: sancho
(12.07.2005 в 14:42)
| | | А этот скрипт только в ie работает ? | |
| |
|
|
| |
|
|
| |
для: msgipss
(12.07.2005 в 15:41)
| | | Не пробовал, в IE точно работает | |
| |
|
|
| |
|
|
| |
для: sancho
(12.07.2005 в 15:54)
| | | Спасибо Санчо, вопрос можно наверное глупый 8)
div_top - стоит на пересечении левой и шапкой это как ?
можно пример html'a ламеру показать (извините) | |
| |
|
|
| |
|
|
| |
для: msgipss
(12.07.2005 в 17:06)
| | | div_top служит для фиксации левого верхнего угла. В приложенном файле поэкспериментируйте с z-index. Если таблицы без скролов добавьте еще строк с ячейками. | |
| |
|
|
| |
|
|
| |
для: sancho
(12.07.2005 в 18:30)
| | | спасибо, Санчо | |
| |
|
|
| |
|
|
| |
для: msgipss
(14.07.2005 в 06:52)
| | | Получилось хоть? | |
| |
|
|
