//create nav
document.write('<div id="slider"><ul class="navigation">')
for (var intImgIndex = 1; intImgIndex < aryImageItems.length; intImgIndex++){
document.write('<li><a class="slidenav' + intImgIndex + '" href="#work' + intImgIndex + '">' + aryImageItems[intImgIndex].imagefilename + '</a></li>')
}
document.write('</ul><div class="scroll"><div class="scrollContainer">')


//create items
for (var intImgIndex = 1; intImgIndex < aryImageItems.length; intImgIndex++){

document.write('<div class="panel" id="work' + intImgIndex + '"><p><a href="work-' + aryImageItems[intImgIndex].url + '"><img src="images/hp-' + aryImageItems[intImgIndex].imagefilename + '-t.png" width="150" height="175" border="0" alt="" class="hp-featured" /></a>'+ aryImageItems[intImgIndex].caption + '</p><p><a href="work-' + aryImageItems[intImgIndex].url + '">Learn more</a> or <a href="thework-featured.html">view all featured projects</a>.</p></div>');
  }

document.write('</div></div></div>')