wuhb
/
oa


			
				
					
						
						
							123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116
							<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en-us" lang="en-us">
<head>
<meta http-equiv="content-type" content="text/html; charset=utf-8" />
<title>jQuery Portlets</title>
<script type="text/javascript" src="jquery.js"></script>
<script type="text/javascript" src="interface.js"></script>
<script type="text/javascript" src="config.js"></script>
<link href="portlets.css" rel="stylesheet" type="text/css"/>
</head>
<body>
<div id="container">
	<a href="http://jquery.com/" id="logo">
		<img src="logo.gif" alt="jQuery: New Wave JavaScript" />
	</a><!-- /#logo -->
	<div id="header">
		<span id="controls">
			<a href="#" id="all_open" title="Open">[ + ]</a>
			<a href="#" id="all_close" title="Close">[ x ]</a>
		</span>
		<a href="#" id="all_expand">Expand</a> ~
		<a href="#" id="all_collapse">Collapse</a> ~
		<a href="#" id="all_invert">Invert</a>
	</div><!-- /#header -->
	<table cellspacing="0" id="columns">
		<tr>
			<td>
				<div class="portlet">
					<div class="portlet_topper">
						1. <a href="#" class="toggle">Toggle</a>
					</div>
					<div class="portlet_content">
						<p>Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Etiam in leo. Nam tellus. Sed tincidunt. Nunc molestie diam sit amet orci. Ut semper. Curabitur cursus euismod turpis. Aenean quis elit ut nulla accumsan nonummy. Phasellus tristique purus quis nibh. Donec adipiscing laoreet nibh. In hac habitasse platea dictumst. Aliquam erat volutpat. Cum sociis natoque penatibus et magnis dis parturient montes, nascetur ridiculus mus. In ut justo. Nulla libero.</p>
					</div>
				</div>
				<div class="portlet">
					<div class="portlet_topper">
						2. <a href="#" class="toggle">Toggle</a>
					</div>
					<div class="portlet_content">
						<p>Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Etiam in leo. Nam tellus. Sed tincidunt. Nunc molestie diam sit amet orci. Ut semper. Curabitur cursus euismod turpis. Aenean quis elit ut nulla accumsan nonummy. Phasellus tristique purus quis nibh. Donec adipiscing laoreet nibh. In hac habitasse platea dictumst. Aliquam erat volutpat. Cum sociis natoque penatibus et magnis dis parturient montes, nascetur ridiculus mus. In ut justo. Nulla libero.</p>
					</div>
				</div>
				<div class="portlet">
					<div class="portlet_topper">
						3. <a href="#" class="toggle">Toggle</a>
					</div>
					<div class="portlet_content">
						<p>Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Etiam in leo. Nam tellus. Sed tincidunt. Nunc molestie diam sit amet orci. Ut semper. Curabitur cursus euismod turpis. Aenean quis elit ut nulla accumsan nonummy. Phasellus tristique purus quis nibh. Donec adipiscing laoreet nibh. In hac habitasse platea dictumst. Aliquam erat volutpat. Cum sociis natoque penatibus et magnis dis parturient montes, nascetur ridiculus mus. In ut justo. Nulla libero.</p>
					</div>
				</div>
			</td>
			<td>
				<div class="portlet">
					<div class="portlet_topper">
						4. <a href="#" class="toggle">Toggle</a>
					</div>
					<div class="portlet_content">
						<p>Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Etiam in leo. Nam tellus. Sed tincidunt. Nunc molestie diam sit amet orci. Ut semper. Curabitur cursus euismod turpis. Aenean quis elit ut nulla accumsan nonummy. Phasellus tristique purus quis nibh. Donec adipiscing laoreet nibh. In hac habitasse platea dictumst. Aliquam erat volutpat. Cum sociis natoque penatibus et magnis dis parturient montes, nascetur ridiculus mus. In ut justo. Nulla libero.</p>
					</div>
				</div>
				<div class="portlet">
					<div class="portlet_topper">
						5. <a href="#" class="toggle">Toggle</a>
					</div>
					<div class="portlet_content">
						<p>Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Etiam in leo. Nam tellus. Sed tincidunt. Nunc molestie diam sit amet orci. Ut semper. Curabitur cursus euismod turpis. Aenean quis elit ut nulla accumsan nonummy. Phasellus tristique purus quis nibh. Donec adipiscing laoreet nibh. In hac habitasse platea dictumst. Aliquam erat volutpat. Cum sociis natoque penatibus et magnis dis parturient montes, nascetur ridiculus mus. In ut justo. Nulla libero.</p>
					</div>
				</div>
				<div class="portlet">
					<div class="portlet_topper">
						6. <a href="#" class="toggle">Toggle</a>
					</div>
					<div class="portlet_content">
						<p>Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Etiam in leo. Nam tellus. Sed tincidunt. Nunc molestie diam sit amet orci. Ut semper. Curabitur cursus euismod turpis. Aenean quis elit ut nulla accumsan nonummy. Phasellus tristique purus quis nibh. Donec adipiscing laoreet nibh. In hac habitasse platea dictumst. Aliquam erat volutpat. Cum sociis natoque penatibus et magnis dis parturient montes, nascetur ridiculus mus. In ut justo. Nulla libero.</p>
					</div>
				</div>
			</td>
			<td>
				<div class="portlet">
					<div class="portlet_topper">
						7. <a href="#" class="toggle">Toggle</a>
					</div>
					<div class="portlet_content">
						<p>Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Etiam in leo. Nam tellus. Sed tincidunt. Nunc molestie diam sit amet orci. Ut semper. Curabitur cursus euismod turpis. Aenean quis elit ut nulla accumsan nonummy. Phasellus tristique purus quis nibh. Donec adipiscing laoreet nibh. In hac habitasse platea dictumst. Aliquam erat volutpat. Cum sociis natoque penatibus et magnis dis parturient montes, nascetur ridiculus mus. In ut justo. Nulla libero.</p>
					</div>
				</div>
				<div class="portlet">
					<div class="portlet_topper">
						8. <a href="#" class="toggle">Toggle</a>
					</div>
					<div class="portlet_content">
						<p>Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Etiam in leo. Nam tellus. Sed tincidunt. Nunc molestie diam sit amet orci. Ut semper. Curabitur cursus euismod turpis. Aenean quis elit ut nulla accumsan nonummy. Phasellus tristique purus quis nibh. Donec adipiscing laoreet nibh. In hac habitasse platea dictumst. Aliquam erat volutpat. Cum sociis natoque penatibus et magnis dis parturient montes, nascetur ridiculus mus. In ut justo. Nulla libero.</p>
					</div>
				</div>
				<div class="portlet">
					<div class="portlet_topper">
						9. <a href="#" class="toggle">Toggle</a>
					</div>
					<div class="portlet_content">
						<p>Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Etiam in leo. Nam tellus. Sed tincidunt. Nunc molestie diam sit amet orci. Ut semper. Curabitur cursus euismod turpis. Aenean quis elit ut nulla accumsan nonummy. Phasellus tristique purus quis nibh. Donec adipiscing laoreet nibh. In hac habitasse platea dictumst. Aliquam erat volutpat. Cum sociis natoque penatibus et magnis dis parturient montes, nascetur ridiculus mus. In ut justo. Nulla libero.</p>
					</div>
				</div>
			</td>
		</tr>
	</table><!-- /#columns -->
	<div id="footer">
		<a href="http://validator.w3.org/check/referer">XHTML</a>
		<a href="http://jigsaw.w3.org/css-validator/check/referer">CSS</a>
		<a href="http://www.contentquality.com/mynewtester/cynthia.exe?Url1=http://host.sonspring.com/portlets/">508</a>
		~ jQuery by <a href="http://ejohn.org/">John Resig</a>
		~ Demo by <a href="http://sonspring.com/journal/jquery-portlets">Nathan Smith</a>
	</div><!-- /#footer -->
</div><!-- /#container -->
</body>
</html>