Указание пути в document.getElementById.
 

Здравствуйте все. В общем, так: есть файл со сценарием, таблица стилей, html страница, по клику ссылки на странице должен действовать сценарий, который задействует таблицу стилей и выводит окно. Проблема в том, что в строке сценария:

document.getElementById(‘Как тут указать путь к стилю «Shwind_u»?‘).style.clip = rect;

В этом вся суть проблемы, нужно указать пути к стилю, кто знает, исправьте, пожалуйста.
Может эту конструкцию можно как-то упростить? А то у меня ссылок много и для каждой нужно писать свой скрипт?
Код страницы:

<div id="Shwind_u">
	<div class="hrift">1</div>
	<p class="hrift_c">2.<br>
	<button style="clear:both; margin-top:30px;" type="button" onClick="shtrClose_1()">Закрыть!</button></p>
</div>
<a href="javascript:shtrOpen_1()" class="strong">1</a>

Скрипт:

var shtrStep = 10; //шаг - количество пикселей на которое будет сворачивать слой за один раз
var shtrTimeout = 15;//задержка перед последующей итерацией для эффекта плавности

//текущее количество обрезаемых пикселей слоя слева и справа
var shtrLeft = 300;
var shtrRight = 300;
var shtrWidth = 600;//ширина слоя

function shtrOpen_1()
{
	if (shtrLeft>0)
	{
		shtrRight += shtrStep; //раскрываем область усечения справа на curtainStep пикселей
		shtrLeft -= shtrStep; //раскрываем область усечения слева на curtainStep пикселей
		
		var rect = 'rect(auto, '+ shtrRight +'px, auto, '+ shtrLeft +'px)';
		
		document.getElementById('Shwind_u',"../CSS/Stranichnie_of").style.clip = rect;
		
		setTimeout(shtrOpen,shtrTimeout); //вызываем эту же функцию повторно через curtainTimeout миллисекунд
	}
}

function shtrClose_1()
{
	if (shtrLeft<shtrRight)//Пока левая граница области усечения не встретилась с правой
	{
		shtrRight -= shtrStep; //сужаем область усечения справа на curtainStep пикселей
		shtrLeft += shtrStep; //сужаем область усечения слева на curtainStep пикселей
		
		var rect = 'rect(auto, '+ shtrRight +'px, auto, '+ shtrLeft +'px)';
		
		document.getElementById(('Shwind_u'),"../CSS/Stranichnie_of").style.clip = rect;
		
		setTimeout(shtrClose,shtrTimeout); //вызываем эту же функцию повторно через curtainTimeout миллисекунд
	}
}

function clipImg_1(on)
{
document.getElementById("clipEx1").style.clip=on?'rect(78px 146px 183px 84px)':'rect(auto,auto,auto,auto)';
}

Таблица стилей:

#Shwind_u
{

/* Настраиваем внешний вид слоя */

	width: 600px; /* шириша слоя диалогового окна */
	height: 400px; /* высота слоя диалогового окна */
	background-color: #FFFFCC; /* цвет слоя диалогового окна */
	border: 1px dotted gray; /* рамка слоя диалогового окна*/

/* Позиционируем слой по центру */

	position: absolute; /* устанавливаем абсолютное позиционирование */
	left: 30%; /* устанавливаем верхний левый угол слоя по горизонтали по центру страницы */
	top:  42%; /* устанавливаем верхний левый угол слоя по вертикали по центру страницы */
	margin-top: -150px; /* сдвигаем слой вверх на половину высоты слоя */
	margin-left: -100px; /* сдвигаем слой влево на половину ширины слоя */

/* делаем слой невидимым */

	clip: rect(auto 300px auto 300px); /* свойство clip подробно рассмотрим ниже (оно ключевое) */
}

-----------------------------------------
С уважением, Антон.

И где вы такое чудо откопали?

document.getElementById('Shwind_u',"../CSS/Stranichnie_of")

Стиль надо заранее подключать. Я бы добавил:

display:none;/*Вот это добавил*/
clip: rect(auto 300px auto 300px); /* свойство clip подробно рассмотрим ниже (оно ключевое) */

Ну и в функции показа слоя:

var rect = 'rect(auto '+ shtrRight +'px auto '+ shtrLeft +'px)';
var obj = document.getElementById('Shwind_u');
if (obj) {
    obj.style.display = 'block';
    obj.style.clip = rect;
}

Спасибо!
TO micscr.
А куда добавить:

var rect = 'rect(auto '+ shtrRight +'px auto '+ shtrLeft +'px)';
var obj = document.getElementById('Shwind_u');
if (obj) {
    obj.style.display = 'block';
    obj.style.clip = rect;
}

Добавьте пожалуйста, а то я не пойму.
Вроде всё собрал воедино, а окно не открывается, не работает, может кто знает, где ошибка.

Вместо этого:

var rect = 'rect(auto, '+ shtrRight +'px, auto, '+ shtrLeft +'px)';
document.getElementById(('Shwind_u'),"../CSS/Stranichnie_of").style.clip =rect;

пробуйте это:

var rect = 'rect(auto '+ shtrRight +'px auto '+ shtrLeft +'px)';
var obj = document.getElementById('Shwind_u');
if (obj) {
    obj.style.display = 'block';
    obj.style.clip = rect;
}

Ещё раз спасибо за советы. Вот ссылка, выложил: http://antton120.narod.ru/vrp/pr.html
Там, всё отдельно, таблица стилей, скрипт и сама страница, как то так я и хочу сделать.
Тут вот всё собрано в одну страницу, работает: http://antton120.narod.ru/vrp/pr_s.html
Пытался сделать по всякому, но всё равно не работает, видимо дело в указании пути к стилю, потому что когда таблица стилей, скрипт и ссылка находятся на одной странице, то всё работает. Посмотрите, пожалуйста, если можете, исправьте ошибку.
-------------------------------------
С уважением, Антон.

Перекрытие слоёв?
 

Заработало! Спасибо всем кто подсказал!
Причина была в неправильном присоединении таблицы стилей.
Результат тут: http://antton120.narod.ru/vrp/pr.html
Только теперь новая проблема, страница на которой всё это установлено, написана div вёрсткой, так вот открывающееся окно оказывается под остальными блоками, и притом происходит это только в IE, версия 7.0, в Mozilla и Opera всё работает как надо.
Пробовал решить проблему, используя z-index, раздвигающемуся слою присваивал 1, а тому, что должно быть под ним 0, не помогло, кто знает, подскажите, как решить эту проблему для Internet Explorer.
-------------------------------------
С уважением, Антон.