Всплывающее изображение на сайте, охватывающее весь сайт

Question

Мне нужно выскочить целый фон на клик. Это можно сделать как изображение в центре страницы, сделав весь сайт менее видимым и за несколько секунд изменив его на другое изображение, или покрыв целую веб-страницу моим изображением, преобразовав его через несколько секунд в следующее изображение всей веб-страницы. После клика все возвращается на круги своя.

<div id="right_center"><img style="cursor: pointer;" onclick='knee_fun()' id="iImg" src="img/knee.png" ></div>


<script>
var time = 3000;
var picNo = 0;
var pics = new Array
(
'img/urazy_1.png',
'img/urazy_2.png',
'img/empty.png'
);

function knee_fun()
{

document.getElementById('iImg').src = pics[picNo++];
if (picNo >1 ) picNo =2; 


setTimeout('knee_fun()', time);
clearTimeout('knee_fun()');

}
</script>

Я сделал это = циклическое 2 изображения, но как расположить его в центре страницы, а не реорганизовать всю страницу? Мне также нужно сделать менее видимым все содержимое страницы в течение этого цикла изображений. (должно заканчиваться после щелчка). Другой вариант - создать цикл изображений, который содержит полную страницу, но должен охватывать всю веб-страницу. и после нажмите вернуться в нормальное состояние.

Кроме того, как добавить вторую функцию с параметром?

            <div id="zoom" onClick="document.getElementById('song').play()">
            <audio id="song" src="nanana.mp3"></audio>
            </div>

когда я добавлю: onclick="doc~(); injuries_change();" id="iImg"> второй не работает