Показать сообщение отдельно
  #1 (permalink)  
Старый 07.11.2010, 19:29
Новичок на форуме
Отправить личное сообщение для xbox Посмотреть профиль Найти все сообщения от xbox
 
Регистрация: 07.11.2010
Сообщений: 3

Как поменять значение width в css
Здравствуйте. Существует следующая проблема:
Есть шаблон joomla, все в нем устраивает кроме того, что при выводе широкой таблицы(элемента) часть таблицы не видно. Настроить шаблон не получилось. Ширина шаблона фиксированная и равна 962 пикселя. Решение проблемы вижу в следующем - написать javascript который динамически будет считать ширину документа исходя из размера таблицы(элемента) и автоматически подставлять ее в (ширину документа) в css(width). Вообщем получилось следующее:
=====
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="ru-ru" lang="ru-ru" >
<head>
<base href="http://localhost/tablica/fizika/6-test.html" />
<meta http-equiv="content-type" content="text/html; charset=utf-8" />
<meta name="robots" content="index, follow" />
<meta name="keywords" content="" />
<meta name="description" content="" />
<meta name="generator" content="Joomla! 1.5 - Open Source Content Management" />
<title>Test</title>
<link rel="stylesheet" href="/tablica/plugins/system/modalizer/modals/fancybox/jquery.fancybox-1.3.1.css" type="text/css" />
<link rel="stylesheet" href="http://localhost/tablica/components/com_tag/css/tagcloud.css" type="text/css" />
<style type="text/css">
    <!--

	#wrapper { margin: 0 auto; width: 962px;padding:0;}
	.s-c-s #colmid { left:160px;}
	.s-c-s #colright { margin-left:-320px;}
	.s-c-s #col1pad { margin-left:320px;}
	.s-c-s #col2 { left:160px;width:160px;}
	.s-c-s #col3 { width:160px;}
	
	.s-c-x #colright { left:160px;}
	.s-c-x #col1wrap { right:160px;}
	.s-c-x #col1 { margin-left:160px;}
	.s-c-x #col2 { right:160px;width:160px;}
	
	.x-c-s #colright { margin-left:-160px;}
	.x-c-s #col1 { margin-left:160px;}
	.x-c-s #col3 { left:160px;width:160px;}
    -->
  </style>

<script type="text/javascript">
//функция wf()
function wf() {
var tb = document.getElementById('tb'); //вытягиваем tb из <table border="1" id="tb"/>
var xrt = tb.offsetWidth; //берем значение offsetWidth от tb т.е. ширину таблицы
var wd; // создаем переменную в которую поместим новое значение ширины документа
if (xrt > 640) // 640 - ширина модуля вывода статьи
{
wd = 962 + (xrt - 640); // вычисляем новую ширину документа
}
else
{
wd = 962; // Если ширина таблицы не превышает 640 пикселей оставляем значение по умолчанию 962 пикселя
}	
//alert(wd); - тестируем, что получилось в wd
	}
</script>
</head>
<body onLoad="wf()"/> <!-- //Вызываем функцию  wf() по событию onLoad(загрузка документа)-->
<div>
<table border="1" id="tb"/> <!- присваиваем id=tb таблице>
<tbody>
<tr>
<td bgcolor="#cccccc"></td>
.....
...
</tbody>
</table>
===
Вопрос в следующем:
Как подставить значение wd вместо 962 в строку из блока css - #wrapper { margin: 0 auto; width: 962px;padding:0;} ?

Последний раз редактировалось xbox, 07.11.2010 в 20:44.
Ответить с цитированием