← Back to branch summary

~bac/juju-gui/trunkcopy

« back to all changes in this revision

Viewing changes to lib/yui/docs/button/button-core.html

  • Committer: kapil.foss at gmail
  • Date: 2012-07-13 18:45:59 UTC
  • Revision ID: kapil.foss@gmail.com-20120713184559-2xl7be17egsrz0c9
reshape

Show diffs side-by-side

added added

removed removed

Lines of Context:
lib/yui/docs/button/button-core.html
1
 
<!DOCTYPE html>
2
 
<html lang="en">
3
 
<head>
4
 
    <meta charset="utf-8">
5
 
    <title>Button</title>
6
 
    <link rel="stylesheet" href="http://fonts.googleapis.com/css?family=Maven+Pro:400,700">
7
 
    <link rel="stylesheet" href="../../build/cssgrids/grids-min.css">
8
 
    <link rel="stylesheet" href="../assets/css/main.css">
9
 
    <link rel="stylesheet" href="../assets/vendor/prettify/prettify-min.css">
10
 
    <script src="../../build/yui/yui-min.js"></script>
11
 
</head>
12
 
<body>
13
 
 
14
 
<div id="doc">
15
 
    <h1>Button</h1>
16
 
 
17
 
    
18
 
        <a href="#toc" class="jump">Jump to Table of Contents</a>
19
 
    
20
 
 
21
 
    <div class="yui3-g">
22
 
        <div class="yui3-u-3-4">
23
 
            <div id="main">
24
 
                <div class="content"><div class="intro">
25
 
    <p>Hello World</p>
26
 
</div>
27
 
 
28
 
<h2 id="getting-started">Getting Started</h2>
29
 
 
30
 
<p>
31
 
To include the source files for Button and its dependencies, first load
32
 
the YUI seed file if you haven't already loaded it.
33
 
</p>
34
 
 
35
 
<pre class="code prettyprint">&lt;script src=&quot;http:&#x2F;&#x2F;yui.yahooapis.com&#x2F;3.5.1&#x2F;build&#x2F;yui&#x2F;yui-min.js&quot;&gt;&lt;&#x2F;script&gt;</pre>
36
 
 
37
 
 
38
 
<p>
39
 
Next, create a new YUI instance for your application and populate it with the
40
 
modules you need by specifying them as arguments to the <code>YUI().use()</code> method.
41
 
YUI will automatically load any dependencies required by the modules you
42
 
specify.
43
 
</p>
44
 
 
45
 
<pre class="code prettyprint">&lt;script&gt;
46
 
&#x2F;&#x2F; Create a new YUI instance and populate it with the required modules.
47
 
YUI().use(&#x27;button&#x27;, function (Y) {
48
 
    &#x2F;&#x2F; Button is available and ready for use. Add implementation
49
 
    &#x2F;&#x2F; code here.
50
 
});
51
 
&lt;&#x2F;script&gt;</pre>
52
 
 
53
 
 
54
 
<p>
55
 
For more information on creating YUI instances and on the
56
 
<a href="http://yuilibrary.com/yui/docs/api/classes/YUI.html#method_use"><code>use()</code> method</a>, see the
57
 
documentation for the <a href="../yui/index.html">YUI Global Object</a>.
58
 
</p>
59
 
 
60
 
</div>
61
 
            </div>
62
 
        </div>
63
 
 
64
 
        <div class="yui3-u-1-4">
65
 
            <div class="sidebar">
66
 
                
67
 
                    <div id="toc" class="sidebox">
68
 
                        <div class="hd">
69
 
                            <h2 class="no-toc">Table of Contents</h2>
70
 
                        </div>
71
 
 
72
 
                        <div class="bd">
73
 
                            <ul class="toc">
74
 
<li>
75
 
<a href="#getting-started">Getting Started</a>
76
 
</li>
77
 
</ul>
78
 
                        </div>
79
 
                    </div>
80
 
                
81
 
 
82
 
                
83
 
                    <div class="sidebox">
84
 
                        <div class="hd">
85
 
                            <h2 class="no-toc">Examples</h2>
86
 
                        </div>
87
 
 
88
 
                        <div class="bd">
89
 
                            <ul class="examples">
90
 
                                
91
 
                                    
92
 
                                        <li data-description="This example shows how you can easily style button and non-button DOM elements to appear as buttons">
93
 
                                            <a href="cssbutton.html">Styling elements with cssbutton</a>
94
 
                                        </li>
95
 
                                    
96
 
                                
97
 
                                    
98
 
                                        <li data-description="This example shows a simple, light solution to enhance &lt;button&gt; nodes">
99
 
                                            <a href="button-plugin.html">Enhancing &lt;button&gt; nodes with button-plugin</a>
100
 
                                        </li>
101
 
                                    
102
 
                                
103
 
                                    
104
 
                                        <li data-description="This example demonstrates how to create button widgets">
105
 
                                            <a href="button.html">Basic button widgets</a>
106
 
                                        </li>
107
 
                                    
108
 
                                
109
 
                                    
110
 
                                        <li data-description="This example demonstrates how to create a widget containing a group of buttons">
111
 
                                            <a href="button-group.html">Managing groups of buttons with button-group</a>
112
 
                                        </li>
113
 
                                    
114
 
                                
115
 
                            </ul>
116
 
                        </div>
117
 
                    </div>
118
 
                
119
 
 
120
 
                
121
 
            </div>
122
 
        </div>
123
 
    </div>
124
 
</div>
125
 
 
126
 
<script src="../assets/vendor/prettify/prettify-min.js"></script>
127
 
<script>prettyPrint();</script>
128
 
 
129
 
</body>
130
 
</html>