franceculture: web/static/css/jq-css/demos/sortable/display-grid.html@cc4a51750724 (annotated)

0 cc4a51750724 first commit ymh <ymh.work@gmail.com> parents: diff changeset	1	<!DOCTYPE html>
cc4a51750724 first commit ymh <ymh.work@gmail.com> parents: diff changeset	2	<html lang="en">
cc4a51750724 first commit ymh <ymh.work@gmail.com> parents: diff changeset	3	<head>
cc4a51750724 first commit ymh <ymh.work@gmail.com> parents: diff changeset	4	<meta charset="UTF-8" />
cc4a51750724 first commit ymh <ymh.work@gmail.com> parents: diff changeset	5	<title>jQuery UI Sortable - Display as grid</title>
cc4a51750724 first commit ymh <ymh.work@gmail.com> parents: diff changeset	6	<link type="text/css" href="../../themes/base/jquery.ui.all.css" rel="stylesheet" />
cc4a51750724 first commit ymh <ymh.work@gmail.com> parents: diff changeset	7	<script type="text/javascript" src="../../jquery-1.4.2.js"></script>
cc4a51750724 first commit ymh <ymh.work@gmail.com> parents: diff changeset	8	<script type="text/javascript" src="../../ui/jquery.ui.core.js"></script>
cc4a51750724 first commit ymh <ymh.work@gmail.com> parents: diff changeset	9	<script type="text/javascript" src="../../ui/jquery.ui.widget.js"></script>
cc4a51750724 first commit ymh <ymh.work@gmail.com> parents: diff changeset	10	<script type="text/javascript" src="../../ui/jquery.ui.mouse.js"></script>
cc4a51750724 first commit ymh <ymh.work@gmail.com> parents: diff changeset	11	<script type="text/javascript" src="../../ui/jquery.ui.sortable.js"></script>
cc4a51750724 first commit ymh <ymh.work@gmail.com> parents: diff changeset	12	<link type="text/css" href="../demos.css" rel="stylesheet" />
cc4a51750724 first commit ymh <ymh.work@gmail.com> parents: diff changeset	13	<style type="text/css">
cc4a51750724 first commit ymh <ymh.work@gmail.com> parents: diff changeset	14	#sortable { list-style-type: none; margin: 0; padding: 0; }
cc4a51750724 first commit ymh <ymh.work@gmail.com> parents: diff changeset	15	#sortable li { margin: 3px 3px 3px 0; padding: 1px; float: left; width: 100px; height: 90px; font-size: 4em; text-align: center; }
cc4a51750724 first commit ymh <ymh.work@gmail.com> parents: diff changeset	16	</style>
cc4a51750724 first commit ymh <ymh.work@gmail.com> parents: diff changeset	17	<script type="text/javascript">
cc4a51750724 first commit ymh <ymh.work@gmail.com> parents: diff changeset	18	$(function() {
cc4a51750724 first commit ymh <ymh.work@gmail.com> parents: diff changeset	19	$("#sortable").sortable();
cc4a51750724 first commit ymh <ymh.work@gmail.com> parents: diff changeset	20	$("#sortable").disableSelection();
cc4a51750724 first commit ymh <ymh.work@gmail.com> parents: diff changeset	21	});
cc4a51750724 first commit ymh <ymh.work@gmail.com> parents: diff changeset	22	</script>
cc4a51750724 first commit ymh <ymh.work@gmail.com> parents: diff changeset	23	</head>
cc4a51750724 first commit ymh <ymh.work@gmail.com> parents: diff changeset	24	<body>
cc4a51750724 first commit ymh <ymh.work@gmail.com> parents: diff changeset	25	<div class="demo">
cc4a51750724 first commit ymh <ymh.work@gmail.com> parents: diff changeset	26
cc4a51750724 first commit ymh <ymh.work@gmail.com> parents: diff changeset	27	<ul id="sortable">
cc4a51750724 first commit ymh <ymh.work@gmail.com> parents: diff changeset	28	<li class="ui-state-default">1</li>
cc4a51750724 first commit ymh <ymh.work@gmail.com> parents: diff changeset	29	<li class="ui-state-default">2</li>
cc4a51750724 first commit ymh <ymh.work@gmail.com> parents: diff changeset	30	<li class="ui-state-default">3</li>
cc4a51750724 first commit ymh <ymh.work@gmail.com> parents: diff changeset	31	<li class="ui-state-default">4</li>
cc4a51750724 first commit ymh <ymh.work@gmail.com> parents: diff changeset	32	<li class="ui-state-default">5</li>
cc4a51750724 first commit ymh <ymh.work@gmail.com> parents: diff changeset	33	<li class="ui-state-default">6</li>
cc4a51750724 first commit ymh <ymh.work@gmail.com> parents: diff changeset	34	<li class="ui-state-default">7</li>
cc4a51750724 first commit ymh <ymh.work@gmail.com> parents: diff changeset	35	<li class="ui-state-default">8</li>
cc4a51750724 first commit ymh <ymh.work@gmail.com> parents: diff changeset	36	<li class="ui-state-default">9</li>
cc4a51750724 first commit ymh <ymh.work@gmail.com> parents: diff changeset	37	<li class="ui-state-default">10</li>
cc4a51750724 first commit ymh <ymh.work@gmail.com> parents: diff changeset	38	<li class="ui-state-default">11</li>
cc4a51750724 first commit ymh <ymh.work@gmail.com> parents: diff changeset	39	<li class="ui-state-default">12</li>
cc4a51750724 first commit ymh <ymh.work@gmail.com> parents: diff changeset	40	</ul>
cc4a51750724 first commit ymh <ymh.work@gmail.com> parents: diff changeset	41
cc4a51750724 first commit ymh <ymh.work@gmail.com> parents: diff changeset	42	</div><!-- End demo -->
cc4a51750724 first commit ymh <ymh.work@gmail.com> parents: diff changeset	43
cc4a51750724 first commit ymh <ymh.work@gmail.com> parents: diff changeset	44	<div class="demo-description">
cc4a51750724 first commit ymh <ymh.work@gmail.com> parents: diff changeset	45
cc4a51750724 first commit ymh <ymh.work@gmail.com> parents: diff changeset	46	<p>
cc4a51750724 first commit ymh <ymh.work@gmail.com> parents: diff changeset	47	To arrange sortable items as a grid, give them identical dimensions and
cc4a51750724 first commit ymh <ymh.work@gmail.com> parents: diff changeset	48	float them using CSS.
cc4a51750724 first commit ymh <ymh.work@gmail.com> parents: diff changeset	49	</p>
cc4a51750724 first commit ymh <ymh.work@gmail.com> parents: diff changeset	50
cc4a51750724 first commit ymh <ymh.work@gmail.com> parents: diff changeset	51	</div><!-- End demo-description -->
cc4a51750724 first commit ymh <ymh.work@gmail.com> parents: diff changeset	52
cc4a51750724 first commit ymh <ymh.work@gmail.com> parents: diff changeset	53	</body>
cc4a51750724 first commit ymh <ymh.work@gmail.com> parents: diff changeset	54	</html>

author	ymh <ymh.work@gmail.com>
	Sat, 12 Jun 2010 04:25:05 +0200
changeset 0	cc4a51750724
permissions	-rw-r--r--