<script type="text/javascript"> //Displays all gallery items inline. Adds divider after 3rd gallery item. //Ideal width versus height ratio: 1.2 : 1 var thumbWidth="160px" //native width is 174px var thumbHeight="134px" //native height is 146px for (i=0; i<csstitles.length; i++){ document.write('<a href="'+cssurl[i]+'"><img src="'+csssrc[i]+'" border="1px" title="'+csstitles[i]+'" width="'+thumbWidth+'" height="'+thumbHeight+'" style="margin-right:5px;" /></a>') if (i==2) //add divider after 3rd gallery item document.write('<div style="margin-top: 6px"></div>') } </script>

Example 2 (show latest 3 entries vertically):

<script type="text/javascript"> //Displays 3 gallery items vertically. Adds gallery title underneath each thumbnail. //Ideal width versus height ratio: 1.2 : 1 var thumbWidth="130px" //native width is 174px var thumbHeight="110px" //native height is 146px for (i=0; i<3; i++) document.write('<div style="margin-bottom: 10px"><a href="'+cssurl[i]+'"><img src="'+csssrc[i]+'" border="1px" title="'+csstitles[i]+'" width="'+thumbWidth+'" height="'+thumbHeight+'"/><br />'+csstitles[i]+'</a></div>') </script>

Example 3 (show 1 entry randomly):

<script type="text/javascript"> //Displays a single gallery item randomly out of 6. //Ideal width versus height ratio: 1.2 : 1 var thumbWidth="174px" //native width is 174px var thumbHeight="146px" //native height is 146px var randomNum=Math.floor(Math.random()*csstitles.length) document.write('<div style="margin-bottom: 10px" style="width:'+thumbWidth+'"><a href="'+cssurl[randomNum]+'"><img src="'+csssrc[randomNum]+'" border="1px" title="'+csstitles[randomNum]+'" width="'+thumbWidth+'" height="'+thumbHeight+'"/><br />'+csstitles[randomNum]+'</a></div>') </script>

Example 4 (show a CSS gallery image slideshow):

<script language="JavaScript1.1"> //Displays a a rotating image slideshow out of all CSS items //Ideal width versus height ratio: 1.2 : 1 var thumbWidth="174px" //native width is 174px var thumbHeight="146px" //native height is 146px var delay=4000 //delay between image change: 3 seconds var count=0; function rotategallery(){ count++; if (count==csssrc.length) count=0; if (window.createPopup) galleryObj.filters[0].apply() galleryObj.src=csssrc[count] if (window.createPopup) galleryObj.filters[0].play() setTimeout("rotategallery()",delay) } function galleryurl(){ window.open(cssurl[count], "css") } function begingallery(){ galleryObj=document.getElementById? document.getElementById("cssgallery") : document.images.cssgallery setTimeout('rotategallery()',delay) } document.write('<a href="javascript:galleryurl()"><img src="'+csssrc[0]+'" width="'+thumbWidth+'" height="'+thumbHeight+'" name="cssgallery" id="cssgallery" border="1px" style="filter:progid:DXImageTransform.Microsoft.Stretch(stretchStyle=\'PUSH\')"></a>') window.onload=begingallery </script>