Skip to main content

Search and Top Navigation

Ticket #6083: boxWidget.html


File boxWidget.html, 1.5 KB (added by sslotsky, September 20, 2010 04:53PM UTC)
<html>
	<head>
		<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.2/jquery.min.js"></script>
		<script type="text/javascript" src="./js/js/jquery-ui-1.8.4.custom.min.js"></script>
		<script type="text/javascript" src="BoxWidget.js"></script>
		<style type="text/css">
			.box {
				width: 100px;
				height: 100px;
				float: left;
			}
			
			.orange {
				background-color: orange;
			}

			.blue {
				background-color: blue;
			}

			.green {
				background-color: green;
			}
			
			.emptyBox {
				margin-top: 10px;
				margin-left: 10px;			
				border: 1px solid;
			}
			
			#container {
				margin-top: 10px;
				width: 346px;
				height: 346px;
				border-style: solid;
				clear: both;
			}
			
			#myBoxes {
				height: 120px;
			}
			
			.closeTab {
				height: 16px;
				width: 16px;
				background-image: url('./images/close-tab.png');
				cursor: pointer;
			}
			
			.inactiveCloseTab {
				height: 16px;
				width: 16px;
				background-image: url('./images/inactive-close-tab.png');
			}
		</style>
	</head>
	<body>
		<div id="myBoxes">
			<div class="box emptyBox">
				<div class="original draggable orange box"></div>
			</div>
			<div class="box emptyBox">
				<div class="original draggable blue box"></div>
			</div>
			<div class="box emptyBox">
				<div class="original draggable green box"></div>
			</div>
		</div>
		
		<script type="text/javascript">
			var boxWidget = new BoxWidget('body', 3);
		</script>
	</body>
</html>

Download in other formats:

Original Format