← Back to branch summary

~jstys-z/helioviewer.org/timeline

« back to all changes in this revision

Viewing changes to lib/jquery/jquery.ui-1.6rc2/demos/functional/templates/ui.resizable.html

  • Committer: V. Keith Hughitt
  • Date: 2009-03-26 19:20:57 UTC
  • Revision ID: hughitt1@kore-20090326192057-u0x8rf8sf5lmmnwh
nightly build 03-26-2009: Using alpha-channel JPEG 2000 dataset

Show diffs side-by-side

added added

removed removed

Lines of Context:
lib/jquery/jquery.ui-1.6rc2/demos/functional/templates/ui.resizable.html
1
 
<script type="text/javascript">
2
 
 
3
 
        var model = {
4
 
 
5
 
                renderAt: '#containerDemo',
6
 
 
7
 
                title: 'Resizable Demos',
8
 
 
9
 
                demos: [
10
 
 
11
 
                        {
12
 
                                title: 'Simple div Resizing',
13
 
                                desc: 'You can play with the options listed below and check the results on the div.',
14
 
                                html: '<div id="simpleDiv" class="resizable">Resize me!</div><br>',
15
 
                                destroy: '$("#simpleDiv").resizable("destroy");',
16
 
 
17
 
                                options: [
18
 
                                        {       desc: 'All handles',    source: '$("#simpleDiv").resizable({ handles: "all"});' },
19
 
                                        {       desc: 'Using helper',   source: '$("#simpleDiv").resizable({ handles: "all", helper: "proxy" });' },
20
 
                                        {       desc: 'Preserving ratio',       source: '$("#simpleDiv").resizable({ handles: "all", aspectRatio: true, helper: "proxy" });' },
21
 
                                        {       desc: 'Autohide handles',       source: '$("#simpleDiv").resizable({ handles: "all", autoHide:true });' },
22
 
                                        {       desc: 'Transparent handles',    source: '$("#simpleDiv").resizable({ handles: "all", transparent: true, helper: "proxy" });' },
23
 
                                        {       desc: 'Pre-defined handles (e,w)',      source: '$("#simpleDiv").resizable({ handles: "e,w" });' },
24
 
                                        {       desc: 'Resize on a grid [50, 50]',      source: '$("#simpleDiv").resizable({ handles: "all", grid: [50, 50] });' },
25
 
                                        {       desc: 'Min/Max height and width',       source: '$("#simpleDiv").resizable({ handles: "all", minWidth: 100, minHeight: 100,     maxWidth: 250, maxHeight: 250 });' },
26
 
                                        {       desc: 'Animated resizing',      source: '$("#simpleDiv").resizable({ handles: "all", animate: true, animateDuration: "slow", animateEasing: "swing" });' },
27
 
                                        {       desc: 'Knob handles (image cropper like)',      source: '$("#simpleDiv").resizable({ handles: "all", knobHandles: true });' },
28
 
                                        {       desc: 'Ghost resizing', source: '$("#simpleDiv").resizable({ handles: "all", ghost:true });' },
29
 
                                        {       desc: 'Prevent default browser resize (safari textarea)',       source: '$("#simpleDiv").resizable({ handles: "all", preventDefault: true });' },
30
 
                                        {       desc: 'Preserve cursor on resize',      source: '$("#simpleDiv").resizable({ handles: "all", preserveCursor: true });' },
31
 
                                        {       desc: 'Using callbacks',        source: '$("#simpleDiv").resizable({ handles: "all", start: function(e, ui) { $(this).append("<br>Start!") }, stop: function(e, ui) { $(this).append("<br>Stop!") }, resize: function(e, ui) { /*$(this).append("<br>Resize!");*/ } });' }
32
 
                                ]
33
 
                        },
34
 
 
35
 
                        {
36
 
                                title: 'Image Resizing',
37
 
                                desc: 'Try resize images! You can play with the options listed below.',
38
 
                                html: '<img id="resizebleImage" src="templates/images/puppy.jpg" width="200px" height="135px">',
39
 
                                destroy: '$("#resizebleImage").resizable("destroy");',
40
 
 
41
 
                                options: [
42
 
                                        {       desc: 'Ghost resizing', source: '$("#resizebleImage").resizable({ handles: "all", ghost:true });' },
43
 
                                        {       desc: 'All handles',    source: '$("#resizebleImage").resizable({ handles: "all"});' },
44
 
                                        {       desc: 'Using helper',   source: '$("#resizebleImage").resizable({ handles: "all", helper: "proxy" });' },
45
 
                                        {       desc: 'Preserving ratio',       source: '$("#resizebleImage").resizable({ handles: "all", aspectRatio: true, helper: "proxy" });' },
46
 
                                        {       desc: 'Autohide handles',       source: '$("#resizebleImage").resizable({ handles: "all", autoHide:true });' },
47
 
                                        {       desc: 'Transparent handles',    source: '$("#resizebleImage").resizable({ handles: "all", transparent: true, helper: "proxy" });' },
48
 
                                        {       desc: 'Pre-defined handles (e,w)',      source: '$("#resizebleImage").resizable({ handles: "e,w" });' },
49
 
                                        {       desc: 'Resize on a grid [50, 50]',      source: '$("#resizebleImage").resizable({ handles: "all", grid: [50, 50] });' },
50
 
                                        {       desc: 'Min/Max height and width',       source: '$("#resizebleImage").resizable({ handles: "all", minWidth: 100, minHeight: 100,        maxWidth: 250, maxHeight: 250 });' },
51
 
                                        {       desc: 'Animated resizing',      source: '$("#resizebleImage").resizable({ handles: "all", animate: true, animateDuration: "slow", animateEasing: "swing" });' },
52
 
                                        {       desc: 'Knob handles (image cropper like)',      source: '$("#resizebleImage").resizable({ handles: "all", knobHandles: true });' },
53
 
                                        {       desc: 'Prevent default browser resize (safari textarea)',       source: '$("#resizebleImage").resizable({ handles: "all", preventDefault: true });' },
54
 
                                        {       desc: 'Preserve cursor on resize',      source: '$("#resizebleImage").resizable({ handles: "all", preserveCursor: true });' },
55
 
                                        {       desc: 'Using callbacks',        source: '$("#resizebleImage").resizable({ handles: "all", start: function(e, ui) { $(this).append("<br>Start!") }, stop: function(e, ui) { $(this).append("<br>Stop!") }, resize: function(e, ui) { /*$(this).append("<br>Resize!");*/ } });' }
56
 
                                ]
57
 
                        },
58
 
 
59
 
                        {
60
 
                                title: 'Textarea Resizing',
61
 
                                desc: 'Try to <b>resize textarea</b>! You can play with the options listed below.',
62
 
                                html: '<textarea id="resizebleTextarea">I am a textarea!</textarea>',
63
 
                                destroy: '$("#resizebleTextarea").resizable("destroy");',
64
 
                                options: [
65
 
                                        {       desc: 'All handles',    source: '$("#resizebleTextarea").resizable({ handles: "all"});' },
66
 
                                        {       desc: 'Using helper',   source: '$("#resizebleTextarea").resizable({ handles: "all", helper: "proxy" });' },
67
 
                                        {       desc: 'Preserving ratio',       source: '$("#resizebleTextarea").resizable({ handles: "all", aspectRatio: true, helper: "proxy" });' },
68
 
                                        {       desc: 'Autohide handles',       source: '$("#resizebleTextarea").resizable({ handles: "all", autoHide:true });' },
69
 
                                        {       desc: 'Transparent handles',    source: '$("#resizebleTextarea").resizable({ handles: "all", transparent: true, helper: "proxy" });' },
70
 
                                        {       desc: 'Pre-defined handles (e,w)',      source: '$("#resizebleTextarea").resizable({ handles: "e,w" });' },
71
 
                                        {       desc: 'Resize on a grid [50, 50]',      source: '$("#resizebleTextarea").resizable({ handles: "all", grid: [50, 50] });' },
72
 
                                        {       desc: 'Min/Max height and width',       source: '$("#resizebleTextarea").resizable({ handles: "all", minWidth: 100, minHeight: 100,     maxWidth: 250, maxHeight: 250 });' },
73
 
                                        {       desc: 'Animated resizing',      source: '$("#resizebleTextarea").resizable({ handles: "all", animate: true, animateDuration: "slow", animateEasing: "swing" });' },
74
 
                                        {       desc: 'Knob handles (image cropper like)',      source: '$("#resizebleTextarea").resizable({ handles: "all", knobHandles: true });' },
75
 
                                        {       desc: 'Ghost resizing', source: '$("#resizebleTextarea").resizable({ handles: "all", ghost:true });' },
76
 
                                        {       desc: 'Prevent default browser resize (safari textarea)',       source: '$("#resizebleTextarea").resizable({ handles: "all", preventDefault: true });' },
77
 
                                        {       desc: 'Preserve cursor on resize',      source: '$("#resizebleTextarea").resizable({ handles: "all", preserveCursor: true });' },
78
 
                                        {       desc: 'Using callbacks',        source: '$("#resizebleTextarea").resizable({ handles: "all", start: function(e, ui) { $(this).append("<br>Start!") }, stop: function(e, ui) { $(this).append("<br>Stop!") }, resize: function(e, ui) { /*$(this).append("<br>Resize!");*/ } });' }
79
 
                                ]
80
 
                        }
81
 
 
82
 
                ]
83
 
 
84
 
        };
85
 
 
86
 
        $(function(){
87
 
 
88
 
                uiRenderDemo(model);
89
 
 
90
 
        });
91
 
 
92
 
</script>
 
 
b'\\ No newline at end of file'