<html>
<head>
<link rel="stylesheet" href="jqueryui/jquery-ui.min.css">
<script src="jqueryui/external/jquery/jquery.js"></script>
<script src="jqueryui/jquery-ui.min.js"></script>
<script src="jqueryui/jquery.cookie.js"></script>
<style>
#tabs{
font-size: 12px;
width: 300px;
}
</style>
<script type="text/javascript">
$(document).ready(function(){
$("#tabs").tabs({
ajaxOptions:{
error: function(xhr,index,status,anchor){
$(anchor.hash).text('could not connect to the server!')
}
}, cookie:{expires:1}}).find('.ui-tabs-nav').sortable({axis:'x'});
});
</script>
</head>
<body>
<div id="tabs">
<ul>
<li><a href="#about">About</a></li>
<li><a href="#contact">Contact</a></li>
<li><a href="#home">Home</a></li>
<li><a href="new.php">PHP</a></li>
</ul>
<div id="about"><p>welcome to my about page!</p></div>
<div id="contact"><p>welcome to my about page!</p></div>
<div id="home"><p>welcome to my about page!</p></div>
</div>
</body>
</html>