CSS Codes
CSS Layouts

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" lang="en" xml:lang="en">
<head>

<script type='text/javascript' src='https://ajax.googleapis.com/ajax/libs/jquery/1.7.2/jquery.min.js'></script>
<link rel="stylesheet" type="text/css" href="ddajaxsidepanel.css" />
<script src="ddajaxsidepanel.js">

/***********************************************
* Ajax Side Panel script- (c) Dynamic Drive (www.dynamicdrive.com)
* Please keep this notice intact
* Visit http://www.dynamicdrive.com/ for this script and 100s more.
***********************************************/

</script>

</head>

<body>

<ul>
<li><a href="http://www.dynamicdrive.com" rel="ajaxpanel">Dynamic Drive</a> (external link, auto loads in IFRAME)</li>
<li><a href="http://www.cssdrive.com" rel="ajaxpanel">CSS Drive</a> (external link, auto loads in IFRAME)</li>
<li><a href="index.html" rel="ajaxpanel">My Home Page</a> (internal link, auto loads using Ajax)</li>
<li><a href="http://www.mysite.com/index.html" rel="ajaxpanel">My Home Page</a> (still internal link, assuming mysite.com is your site's domain, auto loads using Ajax)</li>
<li><a href="http://www.mysite.com/index.html" rel="ajaxpanel" data-loadtype="iframe">My Home Page</a> (internal link, but explicitly load in iframe due to data attribute)</li>
</ul>

</body>
</html>