<div id="gallery"></div>

<script type="text/javascript">
function Gallery(container, pics){
    if(!container) throw 'container is empty!';
    if(!pics || !pics.length) throw 'picture array is empty!';
    
    var img = container.appendChild(create('img'));
    var text = container.appendChild(create('div', 'background-color:#fff;'));
    var counter = 0;
    var isLoading = false;

    addEvent(img, 'click', nextPic);
    addEvent(img, 'load', function() {isLoading = false;text.style.border = '1px solid green';});
    showPic();

    function nextPic() {
        if(isLoading) {
            alert('Warte bis Bild fertig geladen ist');
            return;
        }
        if(++counter === pics.length) counter = 0;
        showPic();
    }
    function showPic() {
        isLoading = true;
        img.src = pics[counter] + '?'+ Math.random();
        text.innerHTML = counter + ' (src='+ img.src + ')';
        text.style.border = '1px solid red';
    }
    function create(tag, style) {
        var el = document.createElement(tag);
        if(style) el.style.cssText = style;
        return el;
    }
    function addEvent(el, evt, f) {
        if(el.addEventListener) el.addEventListener(evt, f, false);
        else throw 'Browser is too old!';
    }
}
var myPics = [ 'http://lorempixel.com/800/400/', 'http://lorempixel.com/800/400/'];

 try{
     Gallery(document.getElementById('gallery'), myPics);
 }catch(e){
     alert(e);
 }