Javascript-форум (https://javascript.ru/forum/)
-   Internet Explorer (https://javascript.ru/forum/css-html-internet-explorer/)
-   -   свойства width и height в IE.... (https://javascript.ru/forum/css-html-internet-explorer/5170-svojjstva-width-i-height-v-ie.html)

alex.v 22.09.2009 16:26

свойства width и height в IE....
 
Доброго времени суток.

Мне нужно сделать функцию создания таблиц,
вот собственно функция(и), кроме всего прочего в шапке таблицы должны создаваться кнопки для возможности редактирования параметров самой таблицы(ну это лирика, важен факт наличия кнопок в хедере.)

*ОФФТОП* Заранее сорри за большое сообщение.

логика функции здесь :

this.addEmptyTable = function(dstTarget, rowNum, colNum, className, arrStylesTd, arrStyleTab) {
        var userAgent = "";
        if (navigator.userAgent.match('MSIE')) {
            userAgent = "ie";
        }
        var table, thead, tbody, tr, td, dragTr, saveLink;
        table = createElem("table", "contTab_" + id, dstTarget, arrStyleTab);
        thead = createElem("thead", "", table, null);
        dragTr = createElem("tr", "dragTr_" + id, thead, null);
        td = createElem("td", "", dragTr, new Array(new Array("height", "20px")));



        if (userAgent == "ie") { 
            var newElSaveLink = document.createElement("input");// вот эта самая кнопка в хедере
            newElSaveLink.id = id + "_editBut";
            newElSaveLink.type = "button";
            newElSaveLink.value = "Edit";
            newElSaveLink.style['cursor'] = "pointer";
            if (td) {
                td.appendChild(newElSaveLink);
            }
        }
        else {
            td.setAttribute("colspan", colNum);
            table.setAttribute("border", "2");
// вот эта самая кнопка в хедере
            saveLink = createElem("input", id + "_editBut", td, new Array(new Array("width", "50px"), new Array("cursor", "pointer")));
            document.getElementById(id + "_editBut").setAttribute("type", "button");
            document.getElementById(id + "_editBut").setAttribute("value", "Edit");
        }


        tbody = createElem("tbody", "", table, null);
        var counter = 1;
        for (var i = 0; i < rowNum; i++) {
            tr = createElem("tr", "", tbody);
            for (var j = 0; j < colNum; j++) {
                td = createElem("td", "contTd" + counter + "_" + id, tr, arrStylesTd);
                counter++;
            }
        }
        return table;
    }
}


далее сама функция которая создает и апендит то что мне надо:

var createElem = function(tagName, id, destTarget, arrStyles) {
        var newEl = document.createElement(tagName);
        newEl.id = id;
        var styleElem, styleValue;
        if (arrStyles && arrStyles.length > 0) {
            for (var i = 0; i < arrStyles.length; i++) {
                styleElem = arrStyles[i][0];
                styleValue = arrStyles[i][1];
                newEl.style[styleElem] = styleValue;
            }
        }
        if (destTarget) {
            destTarget.appendChild(newEl);
        }
        return newEl;
}


это преамбула.

вызываю функцию так:

stArTd = new Array(); // массив стилей для td
stArTd[0] = new Array("background", "red");
//stArTd[1] = new Array("width", "50px");
//stArTd[2] = new Array("height", "50px");


stArTab = new Array(); // массив стилей для table
stArTab[0] = new Array("position", "absolute");
stArTab[1] = new Array("top", "200px");
stArTab[2] = new Array("left", "200px");
stArTab[3] = new Array("width", "300px");
stArTab[4] = new Array("height", "300px");


var comT = new comTable(cCommon.GetGuid());

comT.addEmptyTable(document.getElementById(dropTarget), 3, 3, null, stArTd, stArTab); //вызывем функцию, на dropTarget не обращаем внимание, это то, куда таблица и апендится


Проблема в том, что если задавая параметры width и height самой таблицы (в массиве стилей stArTab) и при этом не задавая width и height для td (в массиве стилей stArTd), везде кроме IE создается и отрисовывается нормальная табличка, с пропорцианальными td-шками, т.е. равного размера ячейками,
в IE же, огромного размера thead в нем кнопка и малюсенькие ячейки самой таблицы.



если же задать width и height для td (закоментированные //stArTd[1] = new Array("width", "50px"); и //stArTd[2] = new Array("height", "50px"))

то все нормально



в чем проблема??

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

любая критика по поводу кода и логики приветствуется, я пока еще нуП ))

Заранее спасибо!!!

Kolyaj 22.09.2009 16:44

Цитата:

Сообщение от alex.v
в чем проблема??

И в чем проблема?

alex.v 23.09.2009 07:41

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

Kolyaj 23.09.2009 08:45

В процентах можно указать.

alex.v 23.09.2009 09:44

Цитата:

Сообщение от Kolyaj
В процентах можно указать.

не пойдет.

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

Kolyaj 23.09.2009 09:51

Цитата:

Сообщение от alex.v
ячейки не будут иметь того процента который я укажу.в зависимости от их количества они будут иметь те размеры, чтобы уместиться в таблице.

Че?

alex.v 23.09.2009 11:44

а вот че:

пример

в моем случае получается так

Kolyaj 23.09.2009 11:56

А зачем пяти ячейкам указывать высоту 50%?

alex.v 23.09.2009 12:06

это я для примера показал, у меня один стиль ко всем ячейкам атачиться.
да вот в том-то и дело что мне не надо указывать размеры ячейки, но если не указывать,то и получается проблема в ie которая в картинках описана в первом сообщении.

Kolyaj 23.09.2009 12:08

Если вы не указываете размеры, то браузер их может установить такими, какими считает нужным. Если указываете невозможные размеры, то же самое. У вас вопрос какой? Как заставить браузер догадываться, что вы от него хотите?


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