<html>
<head >
<title></title>
<script src="Scripts/jquery-2.1.1.js" type="text/javascript"></script>
<script src="Scripts/jquery-ui.js" type="text/javascript"></script>
<link href="themes/vader/jquery-ui.css" type="text/css" rel="stylesheet" />
<link href="themes/vader/theme.css" type="text/css" rel="stylesheet" />
<script type="text/javascript">
$(document).ready(function () {
$("#ulsortable").sortable();
});
</script>
<style type="text/css">
#ulsortable{
list-style-type:none;
margin:5px;
padding:5px;
width:60%;
}
#ulsortable li {
margin:5px;
padding:5px;
font-size:20px;
height:20px;
background-color:aqua;
border:2px solid gray;
cursor:pointer;
}
</style>
</head>
<body>
<form id="form2" runat="server">
<div>
<ul id="ulsortable">
<li>List Item1</li>
<li>List Item2</li>
<li>List Item3</li>
<li>List Item4</li>
<li>List Item5</li>
</ul>
</div>
</form>
</body>
</html>
OUTPUT:
No comments:
Post a Comment