Вопрос: Помогите преобразовать пример
Вот здесь нашел отличный пример плавного открытия/закрытия окна на чистом JS + CSS без использования сторонних библиотек. Но на данном сайте был пример раскрытия окна по горизонтали. Мне же нужно по вертикали.К сожалению как я не старался преобразовать данный пример я не смог. На вас вся надежда, умники с Временно.нет!
P.S. Кому лень кликать по ссылке вот код:
var curtainStep = 10; //шаг - количество пикселей на которое будет сворачивать слой за один раз
var curtainTimeout = 15;//задержка перед последующей итерацией для эффекта плавности
//текущее количество обрезаемых пикселей слоя слева и справа
var curtainLeft = 150;
var curtainRight = 150;
var curtainWidth = 300;//ширина слоя
//ф-ция разворачивания слоя
function curtainOpen()
{
if (curtainLeft > 0)//Пока левая граница области усечения не достигла левой границы слоя
{
curtainRight += curtainStep; //раскрываем область усечения справа на curtainStep пикселей
curtainLeft -= curtainStep; //раскрываем область усечения слева на curtainStep пикселей
var rect = 'rect(auto, '+ curtainRight +'px, auto, '+ curtainLeft +'px)';
document.getElementById("dialogWindow").style.clip = rect;
setTimeout(curtainOpen,curtainTimeout); //вызываем эту же функцию повторно через curtainTimeout миллисекунд
}
}
//ф-ция сворачивания слоя
function curtainClose()
{
if (curtainLeft<curtainRight)//Пока левая граница области усечения не встретилась с правой
{
curtainRight -= curtainStep; //сужаем область усечения справа на curtainStep пикселей
curtainLeft += curtainStep; //сужаем область усечения слева на curtainStep пикселей
var rect = 'rect(auto, '+ curtainRight +'px, auto, '+ curtainLeft +'px)';
document.getElementById("dialogWindow").style.clip = rect;
setTimeout(curtainClose,curtainTimeout); //вызываем эту же функцию повторно через curtainTimeout миллисекунд
}
}