source: other-projects/tipple-android/i-greenstone-server-files/greenstone/webapps/greenstone3/interfaces/default/js/jquery-ui-1.8.15/demos/resizable/animate.html@ 26899

Last change on this file since 26899 was 26899, checked in by davidb, 11 years ago

Tipple reborn after Chris's Summer of Code 2013

File size: 1.2 KB
Line 
1<!DOCTYPE html>
2<html lang="en">
3<head>
4 <meta charset="utf-8">
5 <title>jQuery UI Resizable - Animate</title>
6 <link rel="stylesheet" href="../../themes/base/jquery.ui.all.css">
7 <script src="../../jquery-1.6.2.js"></script>
8 <script src="../../ui/jquery.ui.core.js"></script>
9 <script src="../../ui/jquery.ui.widget.js"></script>
10 <script src="../../ui/jquery.ui.mouse.js"></script>
11 <script src="../../ui/jquery.ui.resizable.js"></script>
12 <link rel="stylesheet" href="../demos.css">
13 <style>
14 #resizable { width: 150px; height: 150px; padding: 0.5em; }
15 #resizable h3 { text-align: center; margin: 0; }
16 .ui-resizable-helper { border: 1px dotted gray; }
17 </style>
18 <script>
19 $(function() {
20 $( "#resizable" ).resizable({
21 animate: true
22 });
23 });
24 </script>
25</head>
26<body>
27
28<div class="demo">
29
30<div id="resizable" class="ui-widget-content">
31 <h3 class="ui-widget-header">Animate</h3>
32</div>
33
34</div><!-- End demo -->
35
36
37
38<div class="demo-description">
39<p>Animate the resize action using the <code>animate</code> option (boolean). When this option is set to true, drag the outline to the desired location; the element animates to that size on drag stop.</p>
40</div><!-- End demo-description -->
41
42</body>
43</html>
Note: See TracBrowser for help on using the repository browser.