Javascript-форум (https://javascript.ru/forum/)
-   Events/DOM/Window (https://javascript.ru/forum/events/)
-   -   маленький оффтоп про "overflow" (https://javascript.ru/forum/events/27505-malenkijj-offtop-pro-overflow.html)

Le-mark43 15.04.2012 13:05

маленький оффтоп про "overflow"
 
Всем привет, сорри за оффтоп, но вы тут все знающие, а я не очень.

имеются 3 элемента div:

<div id='wrap' style='overflow:hidden'>
<div id='d1' style='clear:both;'>
<div id='d2' style='overflow:scroll'>
</div>
</div>
</div>

то бишь родитель показывает только видимую часть, а d2 с полосой прокрутки.
по идее d2 должен сколлиться, но не скроллится, хотя скроллбары показывает.

вопрос:
можно ли при такой верстке заставить d2 сколлиться? и если нет, то как можно?

суть:
известная проблема с реализацией неподвижного заголовка таблицы.
d1 - заголовок, d2 - таблица, так как таблица большая, надо её скроллить. wrap = играет роль как бы окна...

Хоцца:
в идеале: сделать неподвижный заголовок у таблицы.
ну хоть что-то: заставить d2 СКРОЛЛИТЬСЯ.

Ps: плагины, такие как Grid, ради христа не упоминайте, ибо я так даже с местной гопотой не нервничал, как с этим Gridом. до сих пор не понимаю, как люди его используют и у них все работает, НА ВСЕХ БРАУЗЕРАХ, через PHP, на подгружаемых Ajaxом страницах... КААК? 3 дня просрал, разбираясь

Le-mark43 15.04.2012 16:44

и еще тогда до кучи один вопросик:
для выравнивания ячеек таблиц использую нечто вот такое:
сначала рисуем в браузере таблицу class=main. после чего:
/*находим все ТН таблицы, записываем в массив ширину каждого*/
var i=0;
var col = new Array();
$(".main").find("th").each(function(){
head = $(".main").find('th:eq('+i+')');
col[i] = head.width();
i++;
});

/*рисуем фиксированный див, с таблицей (выполняет роль шапки)*/
$('#wrap').prepend("<div id='d1' style='position: fixed; '><table class='mainHead' width='700px'></table></div>");
$(".main").find('thead').clone(true).appendTo('.ma inHead');
for (j=0; j<i; j++){
$('.mainHead th:eq('+j+')').attr('width', col[j]+'px') //выставляем ширину для каждого TH новой таблицы
}
$(".main").find('thead').html(''); //грохаем заголовок у оригинала

на div id='d1' действует скрипт "сайдбар прилипала" (работает пока наоборот, но я с этим думаю разберусь)

все бы ничего, да только не выставляет браузер искомую ширину для таблицы-шапки.
скрипт - работает (смотрел google chromom) в DOM дереве в тегах атрибут 'width' записывается как надо. тока бестолку почему-то...

ширину у TH и ТD обоих таблиц смотрю Alertом, все записываю на бумажке, дважды проверяю. все отрабатывает ПРАВИЛЬНО, но без нужного мне эффекта.
Вопрос: ПОЧЕМУ? и КАК БЫТЬ?

пробовал ширину задавать таким образом:
$("<col width='"+col[j]+"px'>").appendTo('.mainHead');
то бишь вместо назначения ширины для ТН - рисовал <col>, но то ли <col> не действует на ТН, то ли причина в другом, но ситуация та же...

ps: да.. чуть не забыл, ширина у обоих таблиц (оригинала и клона) фиксированная и одинаковая - 700px

Le-mark43 15.04.2012 17:35

Аллилуйа!!!! получилось выровнять резиновые таблицы!
осталось только прояснить тему по поводу первого вопроса.


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