Ticket #3751: helper.2.html

File helper.2.html, 1.1 KB (added by vmx, 11 years ago)

Updated for current trunk

Line 
1<!doctype html>
2<html lang="en">
3<head>
4        <title>jQuery UI Resizable - Helper</title>
5        <link type="text/css" href="../../themes/base/ui.all.css" rel="stylesheet" />
6        <script type="text/javascript" src="../../jquery-1.3.2.js"></script>
7        <script type="text/javascript" src="../../ui/ui.core.js"></script>
8        <script type="text/javascript" src="../../ui/ui.resizable.js"></script>
9        <link type="text/css" href="../demos.css" rel="stylesheet" />
10        <style type="text/css">
11        #resizable { width: 150px; height: 150px; padding: 0.5em; }
12        #resizable h3 { text-align: center; margin: 0; }
13        .ui-resizable-helper { border: 1px dotted gray; }
14        </style>
15        <script type="text/javascript">
16        $(function() {
17                $("#resizable").resizable({
18                        helper: 'ui-resizable-helper'
19                });
20        });
21        </script>
22</head>
23<body>
24<div class="demo">
25       
26<div id="resizable" class="ui-widget-content">
27        <h3 class="ui-widget-header">Helper</h3>
28</div>
29
30</div><!-- End demo -->
31
32<div class="demo-description">
33
34<p>Display only an outline of the element while resizing by setting the <code>helper</code> option toa CSS class.</p>
35
36</div><!-- End demo-description -->
37</body>
38</html>