перемещение картинки

[dimonnnn]

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

[13th]

код документа в студию

а хотя в обще можно создать его копию.
вот так

 <img src="liga13.jpeg" onclick = "yeahMan(this)" />
<script type="text/javascript" >
   function yeahMan(object){
      if(!object){
         return false;
      }
      var newImage = document.createElement('img');
           newImage.src = object.src;
           newImage.style.position = 'fixed';
           newImage.style.top ='50%';
           newImage.style.left ='50%';
           newImage.style.marginLeft =(-1) * parseInt(object.width)/2;
           newImage.style.marginTio =(-1) * parseInt(object.height)/2;
           newImage.onclick = function (){
               this.parentNode.removeChild(this);
           }
           document.appendChild(newImage);
   }
</script>

[Виталий Желтяков]

Используйте jquery там это одной строчкой делается.

[dimonnnn]

ну я написал почти так, но не всё. вот эти строчки я не понял.
в результате

	function PhotoCenter(N, width, path)
	{
		N = parseInt(N);
		width = parseInt(width);
		document.getElementById(N).width = width;
		document.getElementById(N).src = path;
		document.getElementById(N).style.position = 'fixed';
		document.getElementById(N).style.top = '50%';
		document.getElementById(N).style.left = '50%';
	}

в результате у меня не по центру а в правом углу отображается.
можешь пояснить подробней про margine что ты написал и про функцию
newImage.onclick = function (){
this.parentNode.removeChild(this);
}
document.appendChild(newImage);

Jquery я пока не знаю. 3 дня javascript учу. думаю сначала javascript надо выучить, а потом за его библиотеки браться

[dimonnnn]

function PhotoCenter(N, width, height, path)
	{
		N = parseInt(N);
		width = parseInt(width);
		height = parseInt(height);
		document.getElementById(N).width = width;
		document.getElementById(N).src = path;
		document.getElementById(N).style.position = 'absolute';
		document.getElementById(N).style.top = '50%';
		document.getElementById(N).style.right = '50%';
		document.getElementById(N).style.marginLeft = width / 2;
		document.getElementById(N).style.marginTio  = height / 2;
		document.getElementById(N).onclick = function (){
               this.parentNode.removeChild(this);
           }
           document.appendChild(document.getElementById(N));

	}

Проблемы:
1. фотография помещяется не по центру. Она скраю справа. Даже черезчур справа (появилась горизонтальная полоса прокрутки даже)
2. при щелчке на фотографию, полученную с помощью функции PhotoCenter, фотография не помещаятся на предыдущее место, а исчезает.
3. В IE вообще некорректно работает. То есть. При щелчке на фотографию функция PhotoCenter работает так, что фотка вообще исчезает.
На всякий случай ещё раз поясню задачу. Имеется фотография. При щелчке на неё она должна переместиться в центр экрана (причём дизайн страницы не должен измениться). она должна оказаться как бы над страницей. Потом при щелчке на эту фотку, которая над страницей, она должна вернуться на своё прежнее место. функцию написал может и криво... javascript совсем недавно учить начал.. подскажите кто чем может.. любой совет окажется полезным

[dimonnnn]

и ещё. как сделать так чтобы увеличение картинки происходило ПЛАВНО???
и ещё. если мы кликнули по картинке №1, то она должна увеличиться. Если сразу после этого кликнули по картинке №2, то картинка №1 должна уменьшиться до первоначальных размеров, а картинка №2 увеличиться. А если кликнули в свободную область, то картинка №2 должна уменьшиться???

[Виталий Желтяков]

Используйте jQuery и две переменные-триггера.

[ser70]

Ещё лучший эффект будет не при нажатии на картинку, а при наведении курсором мыши.Так лучше и проще.