я немного недогоняю, так как начал совсем недавно изучать javascript, так, чтобы свое что-то написать... если я назначу src после onload, что тогда браузер загружать будет, чьей загрузки мы ждем?
вот еще стили:
<div id="thumb_block" class="thumb_block">
<a href="img/image-01.jpg" onclick="viewPicture(this); return false;"><img src="img/thumb-01.jpg" title="зеленый кактус" /></a>
<a href="img/image-02.jpg" onclick="viewPicture(this); return false;"><img src="img/thumb-02.jpg" title="море" /></a>
<a href="img/image-03.jpg" onclick="viewPicture(this); return false;"><img src="img/thumb-03.jpg" title="солнце" /></a>
<a href="img/image-04.jpg" onclick="viewPicture(this); return false;"><img src="img/thumb-04.jpg" title="вода" /></a>
</div>
<style>
/* CSS Document
* { -moz-box-sizing: border-box; box-sizing: border-box; } */
html { height: 100%; width: 100%; /*min-widht: 980px*/ }
body { padding: 0; margin: 0; width: 100%; height: 100%; background: #fff; font-family: Arial, sans-serif; font-size: 75%; min-widht: 980px}
DIV.conteiner { min-height:100%; height:auto !important; height:100%; margin: 0 auto -50px;}
DIV.footer, DIV.push {height:50px;}
DIV.footer { background: #006633; color: #fff; font-size: 10px; text-align: right; padding-top: 10px; padding-right: 10px}
DIV.conteiner h1 { margin-left: 60px}
div.thumb_block { margin: 50px 0 0 350px;}
/*div#overlay { height: 100%; widht: 100%; position: fixed; top: 0; left: 0; background: #0033CC; z-index: 5 }*/
div#gallery { height: 100%; width: 100%; position: absolute; top: 0; left: 0; z-index: 10; /*background: #006633; opacity: 0.8; filter: alpha(opacity=80); */ background: url(../img/fon.png) repeat}
div#imgcont { position: relative; z-index: 15; border: 1px solid #fff; margin: 50px auto; text-align: center; background: #006600; overflow: hidden}
div#imgcont img { margin: 0px; margin-bottom: 10px}
div#imgcont p { color: #fff; }
div#imgcont a { color: #FFFFFF;}
div#divPre { overflow: hidden; height: 0; width: 0; }
</style>