1<div style="display:block"><img  id="largeimg" data-nr="1" src="resources/images/larges/01.jpg"></div>
2<img data-nr="1" class="clickable" style='cursor:pointer;' src="resources/images/thumbs/01.jpg">
3<img data-nr="2" class="clickable" style='cursor:pointer;' src="resources/images/thumbs/02.jpg">
4. . .
5
6<script type = "text/javascript">       
7  $(document).ready(function(){
8    $(".clickable").each(function({
9      this.click(function(){
10         $("#largeimg").attr("src",this.attr("src")).attr("data-nr",this.attr("data-nr"));
11      }
12    }
13  });
14  function nextpic() {
15    newid = parseInt($("#largeimg").attr("data-nr"))+1;
16    newsrc = $(".clickable[data-nr="+newid+"]").attr("src");
17    $("#largeimg").attr("src",newsrc).attr("data-nr",newid);
18  }
19</script>