Консультация № 34101
25.01.2006, 21:09
0.00 руб.
0 5 5
Здравствуйте.
Возможно я некорректно задал свой предыдущий вопрос. Предположим, что у меня есть таблица в 50 записей, которая не вмещается на экране. Чтобы пролистать ее пользователю приходится использовать прокрутку. Хотелось бы, чтобы при этом шапка всегда оставалась на экране, т.е. в принципе мне нужно тоже самое, что и "замораживание" шапки в Excel.
При этом мне не подходит вариант с фреймами, поскольку тогда кроме шапки в верхний фрейм должны попасть поля фильтра+очень много JavaScript‘ов. Переписывание этого займет очень много времени. IFRAME тоже не подходит по тем ж причинам. Может есть какой-то менее болезненный вариант с использованием того же JavaScript или слоев?

Обсуждение

Неизвестный
25.01.2006, 21:16
общий
это ответ
Здравствуйте, Sulfur!
Используйте два DIV. В верхний выводите шапку, а в нижний -- тело таблицы. Для нижнего назначте стиль overflow: auto; вроде так
Неизвестный
26.01.2006, 00:13
общий
это ответ
Здравствуйте, Sulfur!

Попробуйте фиксированные размеры таблицы. В тэгах table и td укажите width и height, ширина и высота в table должна быть равна сумме всех ячеек по длине и ширине
Неизвестный
26.01.2006, 04:24
общий
это ответ
Единственное решение, которое пришло мне на ум, это использовать приведенный в Приложении код меню для создания шапки. Дело довольно простое. Нужно только подредактировать строки и ячейки. Если возникнут вопросы, задавай. Или пришли на мыло код одной из своих страниц, сделаю шапку сам ;о)
Кстати, можно открыть один из сайтов на boom.ru, они вставляют дополнительно на каждую страницу размещенных там сайтов свой код, который в некоторой интерпритации так же мог бы пригодиться для решения твоей проблемы.

Удачи!

Приложение:
<html><head> <title></title> <meta http-equiv="content-type" content="text/html; charset=windows-1251"> <link rel="stylesheet" type="text/css" href="style.css"><STYLE TYPE="text/css"><!--.menuh { BORDER-COLOR : #FFFF99 ; cursor : hand ; Border-Left : #FFFF99 ; Border-Top : #FFFF99 ; Padding-Left : 1px ; Padding-Top : 1px ; Background-Color : #FFFF99 ; }.menu { Background-Color : white ; }.home { cursor : hand ; }.menulinks{text-decoration:none;}//--></STYLE></head><body bgcolor="#ffffff"><SCRIPT Language="Javascript1.2"><!--/*Static menu script (By maXimus, maximus@nsimail.com, http://maximus.ravecore.com/)Modified slightly/ permission granted to Dynamic Drive to feature script in archiveFor full source, usage terms, and 100‘s more DHTML scripts, visit http://dynamicdrive.com*///configure below variable for menu width, position on pagevar menuwidth=800var offsetleft=1var offsettop=1var ns4=document.layers?1:0var ie4=document.all?1:0var ns6=document.getElementById&&!document.all?1:0function makeStatic() {if (ie4) {object1.style.pixelTop=document.body.scrollTop+offsettop}else if (ns6) {document.getElementById("object1").style.top=window.pageYOffset+offsettop}else if (ns4) {eval(document.object1.top=eval(window.pageYOffset+offsettop));}setTimeout("makeStatic()",0);}if (ie4||ns6) {document.write(‘<span ALIGN="CENTER" ID="object1" STYLE="Position:absolute; Top:20; Left:‘+offsetleft+‘; Z-Index:5;cursor:hand;background-color:black;"><TABLE BORDER="1" width="‘+menuwidth+‘" CELLPADDING="0" CELLSPACING="0" BORDERCOLOR="black" bgcolor="white">‘)}else if (ns4){ document.write(‘<LAYER top="20" name="object1" left="‘+offsetleft+‘" BGCOLOR=black><TABLE BORDER="0" CELLPADDING="0" CELLSPACING="1"><TR><TD><TABLE BORDER="0" CELLPADDING="0" CELLSPACING="0" width="‘+menuwidth+‘">‘)}if (ie4||ns6||ns4)document.write(‘<TR><TD BGCOLOR="#3399FF" BORDERCOLORDARK="#99CCFF" BORDERCOLORLIGHT="#003399"><P ALIGN=CENTER><FONT SIZE="4" FACE=ARIAL>Menu</FONT></TD></TR>‘)var menui = new Array();var menul = new Array();//configure below for menu items. Extend list as desiredmenui[0]="Dynamic Drive";menui[1]="What\‘s New?";menui[2]="What\‘s Hot?";menui[3]="Message Forum";menui[4]="FAQs";menui[5]="Submit Script";menui[6]="Link to us";menui[7]="Email us";menul[0]="http://dynamicdrive.com";menul[1]="http://dynamicdrive.com/new.htm";menul[2]="http://dynamicdrive.com/hot.htm";menul[3]="http://wsabstract.com/cgi-bin/Ultimate.cgi";menul[4]="http://dynamicdrive.com/faqs.htm";menul[5]="http://dynamicdrive.com/submit.htm";menul[6]="http://dynamicdrive.com/link.htm";menul[7]="http://dynamicdrive.com/contact.htm";for (i=0;i<=menui.length-1;i++)if (ie4||ns6) {document.write(‘<TR><TD BORDERCOLOR="white" ONCLICK="location=\‘‘+menul[i]+‘\‘" onmouseover="className=\‘menuh\‘" onMouseout="className=\‘menu\‘"><CENTER><FONT>‘+menui[i]+‘</FONT></TD></TR>‘)}else if (ns4){document.write(‘<TR><TD BGCOLOR="white"><ILAYER><LAYER width="‘+menuwidth+‘" onmouseover="bgColor=\‘yellow\‘" onmouseout="bgColor=\‘white\‘"><CENTER><A HREF="‘+menul[i]+‘" class=menulinks>‘+menui[i]+‘</A></CENTER></LAYER></ILAYER></TD></TR>‘)}if (ie4||ns6) {document.write(‘</TABLE></span>‘)}else if (ns4){document.write(‘</TABLE></TD></TR></TABLE></LAYER>‘)}function menu3(){if (ns6||ie4||ns4)makeStatic()}window.onload=menu3//--></SCRIPT></body></html>
Неизвестный
26.01.2006, 10:22
общий
это ответ
Здравствуйте, Sulfur!
А не устроит ли Вас такой вариант (см.приложение). Скролирование есть, но ни фреймов, ни ифреймов.

Приложение:
<html><body>Это шапка<div width="100%" style="overflow:auto;height:100px">Это контент
1
2
3
4
5
6
</div></body></html>
Неизвестный
27.01.2006, 13:55
общий
это ответ
Здравствуйте, Sulfur!
Mojno cerez absoliutno pozitzionirovanie i s svoistvom scroll!

<div id="banner" style="position:absolute;top:0;left:100">asdasd</div>
<script>
window.onscroll=f; //ne uveren window ili document
window.onmousewheel=f;
function f() {
banner.style.top=document.body.scrollTop;
}
</script>
Форма ответа