[JsLoveR]

Flashton,
Вашу просьбу сделал:

Стили:
Изменил:
clip: rect(200px 300px 200px 300px); /* добавил top и bottom */

<style type="text/css">
	#dialogWindow {
	 
	/* Настраиваем внешний вид слоя */
	    padding-top:200px;
	    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(200px 300px 200px 300px); /* свойство clip подробно рассмотрим ниже (оно ключевое) */
	}
 
	/* заголовок диалогового окна */
	 
	.dTitle {
	    font-weight: bold;
	    margin: 0;
	    padding: 5px;
	    background-color: #CCFFFF;
	}
	 
	/* текст диалогового окна */
	 
	.dBody {
	    text-align: center;
	    margin: 0;
	    padding: 10px 5px;
	}
	</style>

Скрипт:

var curtainStep = 10;
	var curtainTimeout = 15;

	var curtainLeft = 300;
	var curtainTop=200; //Добавил top
	var curtainRight = 300;
	var curtainWidth = 600;
	 var curtainBottom=200;//Добавил bottom
	function curtainOpen()
	{
	    if (curtainLeft>0)
	    {
		    curtainTop -= curtainStep; // усечение top
	        curtainRight += curtainStep; 
	        curtainLeft -= curtainStep; 
	         curtainBottom += curtainStep; // усечение bottom
//Добавил их в rect-->
	        var rect = 'rect('+curtainTop +'px, '+ curtainRight +'px, '+ curtainBottom +'px, '+ curtainLeft +'px)';
	         
	        document.getElementById("dialogWindow").style.clip = rect;
         
	        setTimeout(curtainOpen,curtainTimeout); //вызываем эту же функцию повторно через curtainTimeout миллисекунд
	    }
	}
	 
	function curtainClose()
	{
	    if (curtainLeft<curtainRight)
	    {
		    curtainTop += curtainStep; // сужение top
	        curtainRight -= curtainStep; 
	        curtainLeft += curtainStep; 
	        curtainBottom -= curtainStep; // сужение bottom
//Добавил их в rect-->
	        var rect = 'rect('+curtainTop +'px, '+ curtainRight +'px, '+ curtainBottom +'px, '+ curtainLeft +'px)';
	         
	        document.getElementById("dialogWindow").style.clip = rect;
	         
	        setTimeout(curtainClose,curtainTimeout); 
	    }
	}
	 
	function clipImg(on)
	{
	document.getElementById("clipEx1").style.clip=on?'rect(78px 146px 183px 84px)':'rect(auto,auto,auto,auto)';
	}