Include the client JavaScript & CSS libraries

	<link rel="stylesheet" type="text/css" href="dbnetsuite.css.ashx" />
	<script language="JavaScript" src="dbnetsuite.js.ashx"></script>

Client-side configuration script

	<script>
	jQuery(document).ready( init )

	jQuery("#thumbUnit").bind("change",setThumb)
	jQuery("#thumbSize").bind("change",setThumb)

	function init()
	{
		var dbnetfile1 = new DbNetFile("dbnetfile1");
		with (dbnetfile1)
		{
			rootFolder = "~/samples/DbNetFile/Files/images/beeeaters"
			rootFolderAlias = "Bee-eater Pictures"
			displayStyle = "Grid"
			search = true
			maxSearchMatches = 5
			visibleFileTypes = "jpg,png,gif"
			previewDialogHeight = 800
			previewDialogWidth = 800

			setColumnTypes("Icon","Name","DateCreated","Thumbnail")
			setColumnProperty("Name","label","Name")
			setColumnProperty("Name","selectable",true)
			setColumnProperty("DateCreated","label","Created")
			setColumnProperty("Thumbnail","label","Thumb")
		}

		setThumb()
	}

	function setThumb()
	{
		DbNetLink.components["dbnetfile1"].thumbnailWidth = 0
		DbNetLink.components["dbnetfile1"].thumbnailHeight = 0
		DbNetLink.components["dbnetfile1"].thumbnailPercent = 0
		
		DbNetLink.components["dbnetfile1"][ "thumbnail" + jQuery("#thumbUnit").val()] = jQuery("#thumbSize").val()

		DbNetLink.components["dbnetfile1"].initialize()

	}
	</script>

HTML markup

	<table>
		<tr>
			<td>Thumbnail Size</td>
			<td>
				<select id="thumbUnit">
					<option value="Percent">Percent
					<option value="Width" selected>Width
					<option value="Height">Height
				</select>
			</td>
			<td>
				<select id="thumbSize">
					<option value="10">10
					<option value="20">20
					<option value="30" selected>30
					<option value="40">40
					<option value="50">50
					<option value="60">60
					<option value="70">70
					<option value="80">80
					<option value="90">90
				</select>
			</td>
	</table>
	<div id="dbnetfile1"></div>