← Back to branch summary

~jstys-z/helioviewer.org/client5

« back to all changes in this revision

Viewing changes to lib/jquery/jquery.ui-1.7.1/development-bundle/demos/dialog/modal-confirmation.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.7.1/development-bundle/demos/dialog/modal-confirmation.html
 
1
<!doctype html>
 
2
<html lang="en">
 
3
<head>
 
4
        <title>jQuery UI Dialog - Modal confirmation</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.draggable.js"></script>
 
9
        <script type="text/javascript" src="../../ui/ui.resizable.js"></script>
 
10
        <script type="text/javascript" src="../../ui/ui.dialog.js"></script>
 
11
        <script type="text/javascript" src="../../external/bgiframe/jquery.bgiframe.js"></script>
 
12
        <link type="text/css" href="../demos.css" rel="stylesheet" />
 
13
        <script type="text/javascript">
 
14
        $(function() {
 
15
                $("#dialog").dialog({
 
16
                        bgiframe: true,
 
17
                        resizable: false,
 
18
                        height:140,
 
19
                        modal: true,
 
20
                        overlay: {
 
21
                                backgroundColor: '#000',
 
22
                                opacity: 0.5
 
23
                        },
 
24
                        buttons: {
 
25
                                'Delete all items in recycle bin': function() {
 
26
                                        $(this).dialog('close');
 
27
                                },
 
28
                                Cancel: function() {
 
29
                                        $(this).dialog('close');
 
30
                                }
 
31
                        }
 
32
                });
 
33
        });
 
34
        </script>
 
35
</head>
 
36
<body>
 
37
 
 
38
<div class="demo">
 
39
 
 
40
<div id="dialog" title="Empty the recycle bin?">
 
41
        <p><span class="ui-icon ui-icon-alert" style="float:left; margin:0 7px 20px 0;"></span>These items will be permanently deleted and cannot be recovered. Are you sure?</p>
 
42
</div>
 
43
 
 
44
<!-- Sample page content to illustrate the layering of the dialog -->
 
45
<div class="hiddenInViewSource" style="padding:20px;">
 
46
        <p>Sed vel diam id libero <a href="http://example.com">rutrum convallis</a>. Donec aliquet leo vel magna. Phasellus rhoncus faucibus ante. Etiam bibendum, enim faucibus aliquet rhoncus, arcu felis ultricies neque, sit amet auctor elit eros a lectus.</p>
 
47
        <form>
 
48
                <input value="text input" /><br />
 
49
                <input type="checkbox" />checkbox<br />
 
50
                <input type="radio" />radio<br />
 
51
                <select>
 
52
                        <option>select</option>
 
53
                </select><br /><br />
 
54
                <textarea>textarea</textarea><br />
 
55
        </form>
 
56
</div><!-- End sample page content -->
 
57
 
 
58
</div><!-- End demo -->
 
59
 
 
60
<div class="demo-description">
 
61
 
 
62
<p>Confirm an action that may be destructive or important.  Set the <code>modal</code> option to true, and specify primary and secondary user actions with the <code>buttons</code> option.</p>
 
63
 
 
64
</div><!-- End demo-description -->
 
65
 
 
66
</body>
 
67
</html>