Модераторы: Sardar, Aliance

Поиск:

Ответ в темуСоздание новой темы Создание опроса
> Изменение ширины таблицы джаваскриптом 
:(
    Опции темы
Vidocq
Дата 15.12.2004, 11:45 (ссылка) | (нет голосов) Загрузка ... Загрузка ... Быстрая цитата Цитата


Опытный
**


Профиль
Группа: Участник
Сообщений: 431
Регистрация: 15.12.2004
Где: Запорожье, Украин а

Репутация: нет
Всего: 7



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

Это сообщение отредактировал(а) Vidocq - 15.12.2004, 11:48


--------------------
Всё течёт ©
PM MAIL ICQ   Вверх
Се ля ви
Дата 15.12.2004, 12:46 (ссылка) | (нет голосов) Загрузка ... Загрузка ... Быстрая цитата Цитата


Java/SOAрхитектор
****


Профиль
Группа: Модератор
Сообщений: 2016
Регистрация: 5.6.2004
Где: place without tim e and space

Репутация: 5
Всего: 127



В CSS есть два свойства - overflow и clip. Первое определяет способ отображения содержимого блока, когда оно не влазит в его размеры. По-умолчанию оно установлено в visible, что означает, что блок расширяется и показывает всё, что в нём есть. Можно поставить hidden (не влазящие данные будут отсекааться) или scroll (появятся полосы прокрутки для внутренней области блока).
Свойство clip определяет смещение области отсечения относительно рамеров блока. По-умолчаанию они совпадают с размерами блока, но можно указать rect(top, right, bottom, left) - и область отсечения будет отступать от внутренних границ блока со всех сторон на указанные значения.

Вобщем, в простейшем варианте, указываешь жестко размер ячейки и прописываешь для неё overflow: hidden; Для болеее сложных вещей - играйся с этими параметрами smile


--------------------
  )
 (
[_])
проф. блог

Кролики думали, что занимаются любовью, а на самом деле их просто разводили...
PM MAIL WWW Skype GTalk   Вверх
Vidocq
Дата 15.12.2004, 13:43 (ссылка) | (нет голосов) Загрузка ... Загрузка ... Быстрая цитата Цитата


Опытный
**


Профиль
Группа: Участник
Сообщений: 431
Регистрация: 15.12.2004
Где: Запорожье, Украин а

Репутация: нет
Всего: 7



к Се Ля Ви
А как получить к этому overflow доступ из скрипта?

Код
function resize(tableId, width) {    
var table = document.getElementById(tableId);    
if(table)
{    
table.style.width = width;
table.style.overflow =hidden;//вот здесь чего-то ошибка  :(  
 }  
}


Это сообщение отредактировал(а) Sardar - 15.12.2004, 23:38


--------------------
Всё течёт ©
PM MAIL ICQ   Вверх
Alx
Дата 15.12.2004, 14:25 (ссылка) | (нет голосов) Загрузка ... Загрузка ... Быстрая цитата Цитата


Ajaxy
****


Профиль
Группа: Комодератор
Сообщений: 2903
Регистрация: 26.11.2003
Где: Cutopia

Репутация: 10
Всего: 78



Vidocq
hidden в кавычки smile


--------------------
PM MAIL WWW ICQ   Вверх
Vidocq
Дата 15.12.2004, 14:32 (ссылка) | (нет голосов) Загрузка ... Загрузка ... Быстрая цитата Цитата


Опытный
**


Профиль
Группа: Участник
Сообщений: 431
Регистрация: 15.12.2004
Где: Запорожье, Украин а

Репутация: нет
Всего: 7



да, ещё вопрос: где можно найти какую-нить литературу по css?
Добавлено @ 14:36
2 ALEXANDRO
поставил кавыки,
всё равно не рулит smile

Код

<html>
<head>  
<script>  
function resize(tableId, width) {    
var table = document.getElementById(tableId);    
 if(table)
 {    
 table.style.width = width;
 table.style.overflow ="hidden";      
 }  
}  
</script>
</head>
<body>  
<table border = 1 id = "t1">  
<tr id="tr1">
 <td>Test</td>
 <td>Test1</td>
 <td>Test2</td>
</tr>  
<tr id="tr1">
 <td>Test</td>
 <td>Test1</td>
 <td>Test2</td></tr>  
<tr>
 <td>Test</td>
 <td>Test1</td>
 <td>Test2</td>
</tr>  
</table>  
new size
<input id = "inWidth">
<input type = "button" onclick = "resize('t1', document.getElementById('inWidth').value)" value = "apply">
</body>
</html>



--------------------
Всё течёт ©
PM MAIL ICQ   Вверх
Vidocq
Дата 15.12.2004, 14:51 (ссылка) | (нет голосов) Загрузка ... Загрузка ... Быстрая цитата Цитата


Опытный
**


Профиль
Группа: Участник
Сообщений: 431
Регистрация: 15.12.2004
Где: Запорожье, Украин а

Репутация: нет
Всего: 7



это канеша бред, так как сначала должно идти

table.style.overflow ="hidden";

а уже потом
table.style.width = width;
....
И всё равно не работает smile smile


--------------------
Всё течёт ©
PM MAIL ICQ   Вверх
Vidocq
Дата 15.12.2004, 16:18 (ссылка) | (нет голосов) Загрузка ... Загрузка ... Быстрая цитата Цитата


Опытный
**


Профиль
Группа: Участник
Сообщений: 431
Регистрация: 15.12.2004
Где: Запорожье, Украин а

Репутация: нет
Всего: 7



Блин, как оно ваще работает это overflow???
PM MAIL ICQ   Вверх
Sardar
Дата 15.12.2004, 23:53 (ссылка) | (нет голосов) Загрузка ... Загрузка ... Быстрая цитата Цитата


Бегун
****


Профиль
Группа: Модератор
Сообщений: 6986
Регистрация: 19.4.2002
Где: Нидерланды, Groni ngen

Репутация: 78
Всего: 317



Vidocq на счёт документации смотри в закреплённом топике "хорошая документация", особенно интересно здесь: http://wdh.suncloud.ru/

Твоя проблема решается помещением таблицы в слой и для него задай style.overflow="hidden". Задача странная, может проще скрыть некоторые колонки, а при полном просмотре показать их все?


--------------------
 Опыт - сын ошибок трудных  © А. С. Пушкин
 Процесс написания своего велосипеда повышает профессиональный уровень программиста. © Opik
 Оценить мои качества можно тут.
PM   Вверх
Vidocq
Дата 16.12.2004, 13:27 (ссылка) | (нет голосов) Загрузка ... Загрузка ... Быстрая цитата Цитата


Опытный
**


Профиль
Группа: Участник
Сообщений: 431
Регистрация: 15.12.2004
Где: Запорожье, Украин а

Репутация: нет
Всего: 7



2 Sardar
Цитата
Задача странная, может проще скрыть некоторые колонки, а при полном просмотре показать их все?

Слабо представляю, как это сделать. smile

Лучше попробую со слоями повыпендриваться.

smile
PM MAIL ICQ   Вверх
Vidocq
Дата 16.12.2004, 14:29 (ссылка) | (нет голосов) Загрузка ... Загрузка ... Быстрая цитата Цитата


Опытный
**


Профиль
Группа: Участник
Сообщений: 431
Регистрация: 15.12.2004
Где: Запорожье, Украин а

Репутация: нет
Всего: 7



не знаю но вот эта дрянь не работает:

Код

<html>
<head>  
<script>  
function resize(tableId, width, layerId) {
var layer = document.getElementById(layerId);
var table = document.getElementById(tableId);    
 if(table)
 {    
 layer.style.overflow ="hidden";
 layer.style.width = width;
 table.style.width = width;
 table.style.height =width;
 
 }  
}  
</script>
</head>
<body>  

<layer id='L1' name=tb1 z-index=0 left=0 top=0 width=100>

<table width=100 border = 1 id = "t1">  
<tr id="tr1">
 <td width>Test</td>
 <td>Test1Test1Test1Test1Test1Test1</td>
 <td>Test2</td>
</tr>  
<tr id="tr1">
 <td>Test</td>
 <td>Test1</td>
 <td>Test2</td></tr>  
<tr>
 <td>Test</td>
 <td>Test1</td>
 <td>Test2</td>
</tr>  
</table>
</layer>

     
new size
<input id = "inWidth">
<input type = "button" onclick = "resize('t1', document.getElementById('inWidth').value, 'L1')" value = "apply">
</body>
</html>


текст из ячейки как растягивал её, так и растягивает и не собирается прятаться

.ribbon { z-index: 100; position: absolute; right: 20px; top: 20px; background-image: url(http://student.dn.ua/ya/ribbon.png) !important; background-image: url(http://student.dn.ua/ya/ribbon.gif); /* ie */ background-repeat: no-repeat; width: 150px; height: 193px; cursor: pointer;}


--------------------
Всё течёт ©
PM MAIL ICQ   Вверх
Sardar
Дата 16.12.2004, 16:37 (ссылка) | (нет голосов) Загрузка ... Загрузка ... Быстрая цитата Цитата


Бегун
****


Профиль
Группа: Модератор
Сообщений: 6986
Регистрация: 19.4.2002
Где: Нидерланды, Groni ngen

Репутация: 78
Всего: 317



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

Код
<html>
<head>  
<s c ript language="JavaScript" type="text/javascript">
function resize(tableId, width, layerId) {
var layer = document.getElementById(layerId);
if(layer)  layer.style.width = width;
}  
</sc ript>
</head>
<body>  

<div id='L1' style="position: relative; overflow: hidden; z-index: 0; left:0; top:0;">
<table width="100%" border = 1 id = "t1">  
<tr id="tr1">
<td width>Test</td>
<td>Test1Test1Test1Test1Test1Test1</td>
<td>Test2</td>
</tr>  
<tr id="tr1">
<td>Test</td>
<td>Test1</td>
<td>Test2</td></tr>  
<tr>
<td>Test</td>
<td>Test1</td>
<td>Test2</td>
</tr>  
</table>
</div>

   
new size
<input id = "inWidth">
<input type = "button" onclick = "resize('t1', document.getElementById('inWidth').value, 'L1')" value = "apply">
</body>
</html>


P.S. Подсветка код убивает, потому теги script криво назвал. Поправь перед запуском.


--------------------
 Опыт - сын ошибок трудных  © А. С. Пушкин
 Процесс написания своего велосипеда повышает профессиональный уровень программиста. © Opik
 Оценить мои качества можно тут.
PM   Вверх
Vidocq
Дата 1.2.2005, 11:58 (ссылка) | (нет голосов) Загрузка ... Загрузка ... Быстрая цитата Цитата


Опытный
**


Профиль
Группа: Участник
Сообщений: 431
Регистрация: 15.12.2004
Где: Запорожье, Украин а

Репутация: нет
Всего: 7



Sardar
Класс!!! ТО, что надо! ]()

А как теперь сделать то же самое, только для какого-нить одного столбца? К примеру, для того, у которого много TEST' ов?
Подсунуть слой только для столбца?

Типа:
Код

<div id='L1' style="position: relative; overflow: hidden; z-index: 1; left:0; top:0;">
<td id="td1">Test1Test1Test1Test1Test1Test1</td>
</div>




--------------------
Всё течёт ©
PM MAIL ICQ   Вверх
Sardar
Дата 2.2.2005, 03:05 (ссылка) | (нет голосов) Загрузка ... Загрузка ... Быстрая цитата Цитата


Бегун
****


Профиль
Группа: Модератор
Сообщений: 6986
Регистрация: 19.4.2002
Где: Нидерланды, Groni ngen

Репутация: 78
Всего: 317



Нет, так не пройдёт, нужно оборачивать содержимое каждой ячейки в столбце в слой, либо задавать "position: relative; overflow: hidden;" + размеры для самих ячеек, что более правильно.


--------------------
 Опыт - сын ошибок трудных  © А. С. Пушкин
 Процесс написания своего велосипеда повышает профессиональный уровень программиста. © Opik
 Оценить мои качества можно тут.
PM   Вверх
Vidocq
Дата 2.2.2005, 13:03 (ссылка) | (нет голосов) Загрузка ... Загрузка ... Быстрая цитата Цитата


Опытный
**


Профиль
Группа: Участник
Сообщений: 431
Регистрация: 15.12.2004
Где: Запорожье, Украин а

Репутация: нет
Всего: 7



Sardar
то есть для каждой td

Код

<td id="td" style="position: relative; overflow: hidden; z-index: 0; left:0; top:0;">Test</td>

при этом передавая id="td" в функцию resize()

Или нет?






--------------------
Всё течёт ©
PM MAIL ICQ   Вверх
Sardar
Дата 3.2.2005, 00:16 (ссылка) | (нет голосов) Загрузка ... Загрузка ... Быстрая цитата Цитата


Бегун
****


Профиль
Группа: Модератор
Сообщений: 6986
Регистрация: 19.4.2002
Где: Нидерланды, Groni ngen

Репутация: 78
Всего: 317



Не совем, нужно как я сказал выше перебирать все ячейки в колонке, оборачивать содержимое в слой, который и будет обрезать содержимое. Вот пример:
HTML
<table width=100 border = 1 id = "t1">
<tr id="tr1">
<td width>Test</td>
<td>Test1Test1Test1Test1Test1Test1</td>
<td>Test2</td>
</tr>
<tr id="tr1">
<td>Test</td>
<td>Test1</td>
<td>Test2</td></tr>
<tr>
<td>Test</td>
<td>Test1</td>
<td>Test2</td>
</tr>
</table>

Код
function resizeColumn(id, index, width) {
 var tb=document.getElementById(id), dv;
 if(tb.rows[0].cells.length<=index) return;
 for(var i=0; i<tb.rows.length; i++) {
   dv=document.createElement("DIV");
  dv.style.position="relative";
   dv.style.overflow="hidden";
   dv.style.width=width+"px";
for(var j=0; j<tb.rows[i].cells[index].childNodes.length; j++)
   dv.appendChild(tb.rows[i].cells[index].childNodes[j]);
tb.rows[i].cells[index].appendChild(dv);
 }
}

//ставим вторую колонку в 30 пикселей
resizeColumn("t1",1,30);



--------------------
 Опыт - сын ошибок трудных  © А. С. Пушкин
 Процесс написания своего велосипеда повышает профессиональный уровень программиста. © Opik
 Оценить мои качества можно тут.
PM   Вверх
Vidocq
Дата 3.2.2005, 12:52 (ссылка) | (нет голосов) Загрузка ... Загрузка ... Быстрая цитата Цитата


Опытный
**


Профиль
Группа: Участник
Сообщений: 431
Регистрация: 15.12.2004
Где: Запорожье, Украин а

Репутация: нет
Всего: 7



Sardar
Уменьшение ширины работает. Но после того, как я восстановляю ширину - пропадает (обрезается) текст внутри ячейки...
Как сделать, чтоб он там оставался после восстановления ширины?


--------------------
Всё течёт ©
PM MAIL ICQ   Вверх
Sardar
Дата 3.2.2005, 14:25 (ссылка) | (нет голосов) Загрузка ... Загрузка ... Быстрая цитата Цитата


Бегун
****


Профиль
Группа: Модератор
Сообщений: 6986
Регистрация: 19.4.2002
Где: Нидерланды, Groni ngen

Репутация: 78
Всего: 317



Тогда перепишем пример:
Код

function resizeColumn(id, index, width) {
var tb=document.getElementById(id), dv;
if(tb.rows[0].cells.length<=index) return;
for(var i=0; i<tb.rows.length; i++) {
  dv=tb.rows[i].cells[index].firstChild; //первый элемент в ячейке
  dv.style.position="relative";
  dv.style.overflow="hidden";
  dv.style.width=width+"px";
}

function restoreColumn(id, index) {
var tb=document.getElementById(id), dv;
if(tb.rows[0].cells.length<=index) return;
for(var i=0; i<tb.rows.length; i++) {
  dv=tb.rows[i].cells[index].firstChild; //первый элемент в ячейке
  dv.style.position="static";
  dv.style.overflow="visible";
  dv.style.width="auto";
}

HTML
<table width=100 border = 1 id = "t1">
<tr id="tr1">
<td width><span>Test</span></td>
<td><span>Test1Test1Test1Test1Test1Test1</span></td>
<td><span>Test2</span></td>
</tr>
<tr id="tr1">
<td><span>Test</span></td>
<td><span>Test1</span></td>
<td><span>Test2</span></td></tr>
<tr>
<td><span>Test</span></td>
<td><span>Test1</span></td>
<td><span>Test2</span></td>
</tr>
</table>


Писал на вскидку, не проверял. Теперь в коде не создаётся элемент, а предпологается что первый элемент в ячейке это контейнер, так что не забудь span'ы.


--------------------
 Опыт - сын ошибок трудных  © А. С. Пушкин
 Процесс написания своего велосипеда повышает профессиональный уровень программиста. © Opik
 Оценить мои качества можно тут.
PM   Вверх
Vidocq
Дата 3.2.2005, 15:56 (ссылка) | (нет голосов) Загрузка ... Загрузка ... Быстрая цитата Цитата


Опытный
**


Профиль
Группа: Участник
Сообщений: 431
Регистрация: 15.12.2004
Где: Запорожье, Украин а

Репутация: нет
Всего: 7



Sardar
Кууульноо!
Сколько плюсов я тебе УЖЕ должен? smile

И последнее: как сделать, чтоб любой столбец мог так себя вести?
Я думаю надо перебрать в цикле все индексы, так?



--------------------
Всё течёт ©
PM MAIL ICQ   Вверх
Sardar
Дата 3.2.2005, 18:06 (ссылка) | (нет голосов) Загрузка ... Загрузка ... Быстрая цитата Цитата


Бегун
****


Профиль
Группа: Модератор
Сообщений: 6986
Регистрация: 19.4.2002
Где: Нидерланды, Groni ngen

Репутация: 78
Всего: 317



Надо во всех столбцах обернуть содержимое в span, между тегами <td> и <span> не должно быть ничего, даже пробелов, иначе мозилла проглючит.
Если за место строки:
Код
dv=tb.rows[i].cells[index].firstChild;
//поставить это
dv=(tb.rows[i].cells[index].childNodes[0].nodeType!=1)? dv=tb.rows[i].cells[index].childNodes[1]: dv=tb.rows[i].cells[index].childNodes[0];

То мозилла глючить не будет, но сам не люблю подобные патчи, уж лучше пусть народ мозиллу правит либо пробелы между тегами не ставит smile

После юзая функции можно обрезать любую колонку таблицы.


--------------------
 Опыт - сын ошибок трудных  © А. С. Пушкин
 Процесс написания своего велосипеда повышает профессиональный уровень программиста. © Opik
 Оценить мои качества можно тут.
PM   Вверх
Vidocq
Дата 3.2.2005, 18:25 (ссылка) | (нет голосов) Загрузка ... Загрузка ... Быстрая цитата Цитата


Опытный
**


Профиль
Группа: Участник
Сообщений: 431
Регистрация: 15.12.2004
Где: Запорожье, Украин а

Репутация: нет
Всего: 7



Sardar
а вот так чего не работает:

Код

<table width=100 border = 1 id = "t1" onmouseon="resizeColumn('t1', 1, 30)" onmouseover="restoreColumn('t1', 1)">
<tr id="tr1">
<td width><span>Test</span></td>
<td><span>Test1Test1Test1Test1Test1Test1</span></td>
<td><span>Test2</span></td>
</tr>
<tr id="tr1">
<td><span>Test</span></td>
<td><span>Test1</span></td>
<td><span>Test2</span></td></tr>
<tr>
<td><span>Test</span></td>
<td><span>Test1</span></td>
<td><span>Test2</span></td>
</tr>
</table>



--------------------
Всё течёт ©
PM MAIL ICQ   Вверх
Vidocq
Дата 3.2.2005, 18:43 (ссылка) | (нет голосов) Загрузка ... Загрузка ... Быстрая цитата Цитата


Опытный
**


Профиль
Группа: Участник
Сообщений: 431
Регистрация: 15.12.2004
Где: Запорожье, Украин а

Репутация: нет
Всего: 7



Sardar
в том смысле, что если таких колонок будет 2 и больше, то мне надо чтоб они одновременно срезались/восстанавливались.....


--------------------
Всё течёт ©
PM MAIL ICQ   Вверх
Sardar
Дата 4.2.2005, 00:23 (ссылка) | (нет голосов) Загрузка ... Загрузка ... Быстрая цитата Цитата


Бегун
****


Профиль
Группа: Модератор
Сообщений: 6986
Регистрация: 19.4.2002
Где: Нидерланды, Groni ngen

Репутация: 78
Всего: 317



Vidocq ты попросил пример, я дал его, если совсем не разбираешся в JS, то не надо ходить вокруг да около, говори сразу что нужно smile
Мой код изменяет одну колонку за раз, очевидно если колонок много, то нужно сделать столько же вызовов:
Код
function resizeColumns(id, width, cols) {
 for(var i=0; i<cols.length; i++) resizeColumn(id, cols[i], width);
}
function restoreColumns(id, cols) {
 for(var i=0; i<cols.length; i++) restoreColumn(id, cols[i]);
}

HTML
<table width=100 border = 1 id = "t1" onmouseon="resizeColumns('t1', [1,2], 30)" onmouseover="restoreColumns('t1', [1,2])">
<tr>
<td width><div>Test</div></td>
<td><div>Test1Test1Test1Test1Test1Test1</span></td>
<td><div>Test2</span></td>
</tr>
<tr>
<td><div>Test</div></td>
<td><div>Test1</div></td>
<td><div>Test2</div></td></tr>
<tr>
<td><div>Test</div></td>
<td><div>Test1</div></td>
<td><div>Test2</div></td>
</tr>
</table>


Я ранее немного сглупил, сказав оборачивать содержимое ячеей в span'ы. У тебя в ячейкам может быть что угодно, не только текст, но например и слои. Поэтому оборачивай в DIV'ы.


--------------------
 Опыт - сын ошибок трудных  © А. С. Пушкин
 Процесс написания своего велосипеда повышает профессиональный уровень программиста. © Opik
 Оценить мои качества можно тут.
PM   Вверх
Vidocq
Дата 4.2.2005, 12:14 (ссылка) | (нет голосов) Загрузка ... Загрузка ... Быстрая цитата Цитата


Опытный
**


Профиль
Группа: Участник
Сообщений: 431
Регистрация: 15.12.2004
Где: Запорожье, Украин а

Репутация: нет
Всего: 7



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

я пишу
Код

function resizeColumn(id, width, cols)
{
var tb=document.getElementById(id), dv;
 for(var i=0; i<cols.length; i++)
{

 dv=tb.rows[i].cells[i].lastChild//firstChild; //first element in cell
 dv.style.position="relative";
 dv.style.overflow="hidden";
 dv.style.width=width+"px";
 resizeColumn(id, width, cols[i]);
 }

}

function restoreColumn(id, cols)
{
var tb=document.getElementById(id), dv;
 for(var i=0; i<cols.length; i++)
{

 dv=tb.rows[i].cells[i].lastChild//.firstChild; //first element in cell
 dv.style.position="static";
 dv.style.overflow="visible";
 dv.style.width="auto";
 restoreColumn(id, cols[i]);
 }
}


Код

<table width=100 border = 1 id = "t1" >
<tr>
<td width><div>Test</div></td>
<td><div>Test1Test1Test1Test1Test1Test1</span></td>
<td><div>Test2</div></td>
</tr>
<tr>
<td><div>Test</div></td>
<td><div>Test1</div></td>
<td><div>Test2</div></td></tr>
<tr>
<td><div>Test</div></td>
<td><div>Test1</div></td>
<td><div>Test2</div></td>
</tr>
</table>

new size
<input id = "inWidth">
<input type = "button" onclick="resizeColumn('t1', document.getElementById('inWidth').value, [0,1,2])" value = "apply">

old size
<input type = "button" onclick="restoreColumn('t1', [0,1,2])" value = "restore">


но код не работает. Вернее, работает, но не так, как мне надо... Что неправильно


--------------------
Всё течёт ©
PM MAIL ICQ   Вверх
Sardar
Дата 4.2.2005, 14:39 (ссылка) | (нет голосов) Загрузка ... Загрузка ... Быстрая цитата Цитата


Бегун
****


Профиль
Группа: Модератор
Сообщений: 6986
Регистрация: 19.4.2002
Где: Нидерланды, Groni ngen

Репутация: 78
Всего: 317



Мдям, функции рекурсивно вызывают сами себя, читай свой код внимательно smile
Код
function resizeColumns(id, width, cols) { //множественное Columns
 var tb=document.getElementById(id), dv;
 for(var i=0; i<cols.length; i++) {
   dv=tb.rows[i].cells[i].firstChild; //first element in cell
   dv.style.position="relative";
   dv.style.overflow="hidden";
   dv.style.width=width+"px";
 }
}

function restoreColumn(id, cols) {
  var tb=document.getElementById(id), dv;
  for(var i=0; i<cols.length; i++) {
     dv=tb.rows[i].cells[i].firstChild; //first element in cell
     dv.style.position="static";
     dv.style.overflow="visible";
     dv.style.width="auto";
  }
}


JS это не тяп-ляп, читай что ты пишешь, исполняй в уме, кучу ошибок предотвратишь smile


--------------------
 Опыт - сын ошибок трудных  © А. С. Пушкин
 Процесс написания своего велосипеда повышает профессиональный уровень программиста. © Opik
 Оценить мои качества можно тут.
PM   Вверх
Vidocq
Дата 4.2.2005, 17:09 (ссылка) | (нет голосов) Загрузка ... Загрузка ... Быстрая цитата Цитата


Опытный
**


Профиль
Группа: Участник
Сообщений: 431
Регистрация: 15.12.2004
Где: Запорожье, Украин а

Репутация: нет
Всего: 7



Sardar
так не работает smile


--------------------
Всё течёт ©
PM MAIL ICQ   Вверх
Sardar
Дата 5.2.2005, 02:52 (ссылка) | (нет голосов) Загрузка ... Загрузка ... Быстрая цитата Цитата


Бегун
****


Профиль
Группа: Модератор
Сообщений: 6986
Регистрация: 19.4.2002
Где: Нидерланды, Groni ngen

Репутация: 78
Всего: 317



Покажи код вёрстки, как ты эти функции вызываешь. Вообще пробуй анализировать как что работает, либо поясняй что за ошибка. "Так не работает" - на такое либо телепаты либо парни из "саппорта" ответить могут, я не отношусь ни к первым, ни ко вторым smile


--------------------
 Опыт - сын ошибок трудных  © А. С. Пушкин
 Процесс написания своего велосипеда повышает профессиональный уровень программиста. © Opik
 Оценить мои качества можно тут.
PM   Вверх
Vidocq
Дата 7.2.2005, 10:49 (ссылка) | (нет голосов) Загрузка ... Загрузка ... Быстрая цитата Цитата


Опытный
**


Профиль
Группа: Участник
Сообщений: 431
Регистрация: 15.12.2004
Где: Запорожье, Украин а

Репутация: нет
Всего: 7



Sardar
"Вспылил, был неправ" (с) smile

Код


function restoreColumn(id, cols)
{
var tb=document.getElementById(id), dv;
//if(tb.rows[0].cells.length<=i) return;
for(var i=0; i<cols.length; i++)
{
 dv=tb.rows[i].cells[i].lastChild//.firstChild; //first element in cell
 dv.style.position="static";
 dv.style.overflow="visible";
 dv.style.width="auto";
 //restoreColumn(id, cols[i]);
 }
}


function resizeColumn(id, width, cols)
{
var tb=document.getElementById(id), dv;
for(var i=0; i<cols.length; i++)
{
 dv=tb.rows[i].cells[i].lastChild//firstChild; //first element in cell
 dv.style.position="relative";
 dv.style.overflow="hidden";
 dv.style.width=width+"px";
 //resizeColumn(id, width, cols[i]);
 }
}


Код


<table width=100 border = 1 id = "t1" >
<tr>
<td width><div>Test</div></td>
<td><div>Test1Test1Test1Test1Test1Test1</span></td>
<td><div>Test2</div></td>
</tr>
<tr>
<td><div>Test</div></td>
<td><div>Test1</div></td>
<td><div>Test2</div></td></tr>
<tr>
<td><div>Test</div></td>
<td><div>Test1</div></td>
<td><div>Test2</div></td>
</tr>
</table>

new size
<input id = "inWidth">
<input type = "button" onclick="resizeColumn('t1', document.getElementById('inWidth').value, [0,1,2])" value = "apply">

old size
<input type = "button" onclick="restoreColumn('t1', [0,1,2])" value = "restore">



--------------------
Всё течёт ©
PM MAIL ICQ   Вверх
Sardar
Дата 7.2.2005, 22:29 (ссылка) | (нет голосов) Загрузка ... Загрузка ... Быстрая цитата Цитата


Бегун
****


Профиль
Группа: Модератор
Сообщений: 6986
Регистрация: 19.4.2002
Где: Нидерланды, Groni ngen

Репутация: 78
Всего: 317



Вот этот код работает, он очень простой, но лучше не модиффицируй его, если не понимаешь что к чему. Спрашивай что не понимаешь, желательно в другом топике, ибо этот слишком разросся.
HTML
<script language="Javascript" type="text/javascript">
<!--
function resizeColumns(id, width, cols) {
for(var i=0; i<cols.length; i++) resizeColumn(id, cols[i], width);
}
function restoreColumns(id, cols) {
for(var i=0; i<cols.length; i++) restoreColumn(id, cols[i]);
}
function resizeColumn(id, index, width) {
var tb=document.getElementById(id), dv;
if(tb.rows[0].cells.length<=index) return;
for(var i=0; i<tb.rows.length; i++) {
dv=tb.rows[i].cells[index].firstChild; //ïåðâûé ýëåìåíò â ÿ÷åéêå
dv.style.position="relative";
dv.style.overflow="hidden";
dv.style.width=width+"px";
}
}
function restoreColumn(id, index) {
var tb=document.getElementById(id), dv;
if(tb.rows[0].cells.length<=index) return;
for(var i=0; i<tb.rows.length; i++) {
dv=tb.rows[i].cells[index].firstChild; //ïåðâûé ýëåìåíò â ÿ÷åéêå
dv.style.position="static";
dv.style.overflow="visible";
dv.style.width="auto";
}
}
//-->
</script>

<table width=100 border = 1 id = "t1" >
<tr>
<td><div>Test</div></td>
<td><div>Test1Test1Test1Test1Test1Test1</span></td>
<td><div>Test2</div></td>
</tr>
<tr>
<td><div>Test</div></td>
<td><div>Test1</div></td>
<td><div>Test2</div></td></tr>
<tr>
<td><div>Test</div></td>
<td><div>Test1</div></td>
<td><div>Test2</div></td>
</tr>
</table>

new size
<input id = "inWidth">
<input type = "button" onclick="resizeColumns('t1', document.getElementById('inWidth').value, [0,1,2])" value = "apply">

old size
<input type = "button" onclick="restoreColumns('t1', [0,1,2])" value = "restore">


Когда будешь переписывать смотри на число(множественное и т.д. например Columns) smile


--------------------
 Опыт - сын ошибок трудных  © А. С. Пушкин
 Процесс написания своего велосипеда повышает профессиональный уровень программиста. © Opik
 Оценить мои качества можно тут.
PM   Вверх
Страницы: (2) [Все] 1 2 
Ответ в темуСоздание новой темы Создание опроса
Форум для вопросов, которые имеются в справочниках, но их поиск вызвал затруднения, или для разработчика требуется совет или просьба отыскать ошибку. Напоминаем: 1) чётко формулируйте вопрос, 2) приведите пример того, что уже сделано, 3) укажите явно, нужен работающий пример или подсказка о том, где найти информацию.
 
0 Пользователей читают эту тему (0 Гостей и 0 Скрытых Пользователей)
0 Пользователей:
« Предыдущая тема | JavaScript: Общие вопросы | Следующая тема »


 




[ Время генерации скрипта: 0.1441 ]   [ Использовано запросов: 22 ]   [ GZIP включён ]


Реклама на сайте     Информационное спонсорство

 
По вопросам размещения рекламы пишите на vladimir(sobaka)vingrad.ru
Отказ от ответственности     Powered by Invision Power Board(R) 1.3 © 2003  IPS, Inc.