97 |
98 |
99 |
100 |
101 |
102 |
103 |
104 |
105 |
106 |
107 |
108 |
109 |
110 |
111 |
112 |
113 |
114 | ```
115 |
116 | ## Initializing the plugin
117 |
118 | ### pinny()
119 |
120 | Initializes the pinny.
121 |
122 | ```js
123 | $('#myPinny').pinny({
124 | effect: modalCenter
125 | });
126 | ```
127 |
128 | You can also initialize the Pinny through the use of a data attribute. The attribute takes a value equal to the effect you want to use.
129 |
130 | ```html
131 |
132 | ```
133 |
134 | _You *must* pass Pinny an effect for it to work._
135 |
136 | ### pinny(options)
137 |
138 | Initialize with options.
139 |
140 | ```js
141 | $('#myPinny').pinny({
142 | effect: sheetBottom,
143 | container: '#container',
144 | structure: {
145 | header: 'My Pinny Title',
146 | footer: false
147 | },
148 | zIndex: 2,
149 | cssClass: 'my-pinny-class',
150 | coverage: '100%',
151 | easing: 'swing',
152 | duration: 200,
153 | shade: {
154 | color: '#404040'
155 | },
156 | open: noop,
157 | opened: noop,
158 | close: noop,
159 | closed: noop
160 | });
161 | ```
162 |
163 | #### Options
164 |
165 | ##### effect
166 |
167 | default: `{
168 | open: noop,
169 | close: noop
170 | },`
171 |
172 | Specifies which `effect` module Pinny should use when opening. `Effect` modules allow you to load specific functionality that tell Pinny how to open and close. Available `effect` modules can be found in the `dist/effect` folder. Current `effect` modules include:
173 |
174 | - Modal Center - opens Pinny in the center of the screen
175 | - Sheet Top - slides down from the top of the screen
176 | - Sheet Bottom - slides up from the bottom of the screen
177 | - Sheet Left - slides in from the left of the screen
178 | - Sheet Right - slides in from the right of the screen
179 |
180 | ```js
181 | $('#myPinny').pinny({
182 | effect: sheetLeft
183 | });
184 | ```
185 |
186 | #### container
187 |
188 | default: ``
189 |
190 | Specify the container Pinny will be created within
191 |
192 | ```js
193 | $('#myPinny').pinny({
194 | container: $('#mainForm') // or container: '#mainForm'
195 | });
196 | ```
197 |
198 |
199 | #### appendTo
200 |
201 | default: null
202 |
203 | Specify the element Pinny will be appended to. By default Pinny will be appended
204 | to the lockup container. If you want it to be appended outside the lockup container,
205 | specify that element here.
206 |
207 | ```js
208 | $('#myPinny').pinny({
209 | appendTo: 'body'
210 | });
211 | ```
212 |
213 |
214 | ##### structure
215 |
216 | default: `{
217 | header: '',
218 | footer: false
219 | }`
220 |
221 | Defines the structure to use for Pinny. Specifically, Pinny tries to build its own HTML structure if passed the default options.
222 |
223 | **If you want to have full control over the HTML of your Pinny, including the header, footer, and content section, set `structure: false`**. Setting `structure: false` will still allow the `close` event to be bound to any element that has the `pinny__close` class, allowing you to specify the element that should trigger closing your Pinny.
224 |
225 | If you are using `structure: false`, you will need to structure your HTML to include the following elements (*missing any elements will cause Pinny to not function*):
226 |
227 | ```html
228 |
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Cras ut nisl id libero tempus porta. Morbi id mauris ut
17 | purus luctus fringilla sed a mi. Morbi dignissim nisl euismod quam cursus laoreet. Duis adipiscing condimentum
18 | arcu, sed gravida urna dictum vel. Nullam quis dolor justo. Mauris eleifend massa ut eros mattis, non sodales
19 | libero hendrerit. Donec vitae nisl imperdiet, vestibulum nisi a, pulvinar libero. Suspendisse potenti.
20 |
21 |
Duis vel rutrum velit. Cras viverra facilisis nisi, sed fringilla neque imperdiet nec. Class aptent taciti
22 | sociosqu ad litora torquent per conubia nostra, per inceptos himenaeos. Nam aliquam euismod odio, in suscipit
23 | est pretium vitae. Ut ut dui massa. Aenean viverra enim nulla, eget dapibus nibh facilisis non. Curabitur sed
24 | velit quis velit egestas malesuada. Morbi faucibus auctor sem, eu tincidunt ligula tincidunt sed. Sed posuere
25 | malesuada lacinia. Curabitur semper luctus quam, id ornare nulla lacinia a. Curabitur pretium pharetra lacus nec
26 | vulputate. Nam consectetur ipsum erat, vel egestas nulla varius at. Etiam aliquet pretium volutpat. In turpis
27 | ipsum, euismod at porta at, aliquam vel sem. Integer ornare ipsum non mattis malesuada. Cras sapien tortor,
28 | hendrerit in pretium sollicitudin, auctor ac elit.
29 |
30 |
31 |
32 |
33 |
34 |
35 |
36 |
37 |
38 |
39 |
Integer lacinia tortor nec nisi vehicula pellentesque. Nullam at augue a sem accumsan placerat. Nullam pharetra
40 | fermentum luctus. Phasellus volutpat sem eget varius cursus. Cras porta vulputate augue, a semper odio mollis
41 | eu. Vivamus elementum, odio et volutpat rhoncus, arcu metus porta est, sed congue sapien dolor sed arcu. Donec
42 | vestibulum ipsum sit amet ante dictum iaculis. Cras nec venenatis leo, eu facilisis tellus. Fusce vel tellus
43 | risus. Sed in elementum lorem, nec congue arcu. Ut sed mattis turpis, ut dignissim metus.
44 |
45 |
Vivamus dignissim arcu eget eros auctor, vel sodales erat bibendum. Nunc scelerisque urna eros, ac rhoncus mauris
46 | lacinia non. Nullam dictum orci ante, quis aliquet risus dictum ultrices. Maecenas lacinia laoreet odio vitae
47 | aliquam. Sed scelerisque nunc nibh, eget ultrices mi consequat non. Fusce aliquam gravida enim, luctus eleifend
48 | turpis iaculis ac. Donec fringilla augue vitae malesuada viverra. Quisque tempus iaculis tincidunt. Ut quis
49 | malesuada enim. In et dui est.
Pinafores may be worn by girls as a decorative garment and by both girls and women as a protective apron. A related term is pinafore dress, which is British English for what in American English is known as a jumper dress, i.e. a sleeveless dress intended to be worn over a top or blouse. A key difference between a pinafore and a jumper dress is that the pinafore is open in the back. In informal British usage however, a pinafore dress is sometimes referred to as simply a pinafore, which can lead to confusion.
58 |
The name reflects that the pinafore was formerly pinned (pin) to the front (afore) of a dress. The pinafore had no buttons, was simply "pinned on the front" which led to the term "pinafore."
Pinafores are often confused with smocks. Some languages do not differentiate between these different garments. The pinafore differs from a smock in that it does not have sleeves and there is no back to the bodice. Smocks have both sleeves and a full bodice, both front and back.
61 |
A pinafore is a full apron with two holes for the arms that is tied or buttoned in the back, usually just below the neck. Pinafores have complete front shaped over shoulder while aprons usually have no bib, or only a smaller one. A child's garment to wear at school or for play would be a pinafore.
62 |
Further confusion results from some foreign languages, which, unlike English, do not have a distinctive term for the pinafore. In German, for example, there is no precise term for pinafore. Schürze means "apron" and thus Kinderschürze is used to describe a child's apron or pinafore (in contrast to the German word "Kittelschürze", which refers to an adult garment, typically worn by older women for housework tasks and cleaning).
63 |
In modern times, the term "pinny" or "pinnie" has taken another meaning in sports wear, namely a double-sided short apron, often made of mesh, used to differentiate teams. This usage is chiefly British, with some usage in Canada and the United States. This type of pinny is also known as a scrimmage vest.[citation needed]
The pinafore was a type of apron that was pinned over the dress and easily removed for washing. Buttons were frequently damaged with lye cleaning products, which was one reason why dresses were not laundered very often.
Granville, the errand boy of the British TV series Open All Hours, frequently complains about his having to wear a pinny and his being unable to acquire a modern look because of the pinny.
73 |
United Kingdom television programme Sugar Rush describes one of the main characters Nathan, as "Half man, Half pinny."
Pinafores may be worn by girls as a decorative garment and by both girls and women as a protective apron. A related term is pinafore dress, which is British English for what in American English is known as a jumper dress, i.e. a sleeveless dress intended to be worn over a top or blouse. A key difference between a pinafore and a jumper dress is that the pinafore is open in the back. In informal British usage however, a pinafore dress is sometimes referred to as simply a pinafore, which can lead to confusion.
86 |
The name reflects that the pinafore was formerly pinned (pin) to the front (afore) of a dress. The pinafore had no buttons, was simply "pinned on the front" which led to the term "pinafore."
Pinafores are often confused with smocks. Some languages do not differentiate between these different garments. The pinafore differs from a smock in that it does not have sleeves and there is no back to the bodice. Smocks have both sleeves and a full bodice, both front and back.
89 |
A pinafore is a full apron with two holes for the arms that is tied or buttoned in the back, usually just below the neck. Pinafores have complete front shaped over shoulder while aprons usually have no bib, or only a smaller one. A child's garment to wear at school or for play would be a pinafore.
90 |
Further confusion results from some foreign languages, which, unlike English, do not have a distinctive term for the pinafore. In German, for example, there is no precise term for pinafore. Schürze means "apron" and thus Kinderschürze is used to describe a child's apron or pinafore (in contrast to the German word "Kittelschürze", which refers to an adult garment, typically worn by older women for housework tasks and cleaning).
91 |
In modern times, the term "pinny" or "pinnie" has taken another meaning in sports wear, namely a double-sided short apron, often made of mesh, used to differentiate teams. This usage is chiefly British, with some usage in Canada and the United States. This type of pinny is also known as a scrimmage vest.[citation needed]
The pinafore was a type of apron that was pinned over the dress and easily removed for washing. Buttons were frequently damaged with lye cleaning products, which was one reason why dresses were not laundered very often.
Granville, the errand boy of the British TV series Open All Hours, frequently complains about his having to wear a pinny and his being unable to acquire a modern look because of the pinny.
101 |
United Kingdom television programme Sugar Rush describes one of the main characters Nathan, as "Half man, Half pinny."
Pinafores may be worn by girls as a decorative garment and by both girls and women as a protective apron. A related term is pinafore dress, which is British English for what in American English is known as a jumper dress, i.e. a sleeveless dress intended to be worn over a top or blouse. A key difference between a pinafore and a jumper dress is that the pinafore is open in the back. In informal British usage however, a pinafore dress is sometimes referred to as simply a pinafore, which can lead to confusion.
110 |
The name reflects that the pinafore was formerly pinned (pin) to the front (afore) of a dress. The pinafore had no buttons, was simply "pinned on the front" which led to the term "pinafore."
Pinafores are often confused with smocks. Some languages do not differentiate between these different garments. The pinafore differs from a smock in that it does not have sleeves and there is no back to the bodice. Smocks have both sleeves and a full bodice, both front and back.
113 |
A pinafore is a full apron with two holes for the arms that is tied or buttoned in the back, usually just below the neck. Pinafores have complete front shaped over shoulder while aprons usually have no bib, or only a smaller one. A child's garment to wear at school or for play would be a pinafore.
114 |
Further confusion results from some foreign languages, which, unlike English, do not have a distinctive term for the pinafore. In German, for example, there is no precise term for pinafore. Schürze means "apron" and thus Kinderschürze is used to describe a child's apron or pinafore (in contrast to the German word "Kittelschürze", which refers to an adult garment, typically worn by older women for housework tasks and cleaning).
115 |
In modern times, the term "pinny" or "pinnie" has taken another meaning in sports wear, namely a double-sided short apron, often made of mesh, used to differentiate teams. This usage is chiefly British, with some usage in Canada and the United States. This type of pinny is also known as a scrimmage vest.[citation needed]
The pinafore was a type of apron that was pinned over the dress and easily removed for washing. Buttons were frequently damaged with lye cleaning products, which was one reason why dresses were not laundered very often.
Granville, the errand boy of the British TV series Open All Hours, frequently complains about his having to wear a pinny and his being unable to acquire a modern look because of the pinny.
125 |
United Kingdom television programme Sugar Rush describes one of the main characters Nathan, as "Half man, Half pinny."
Pinafores may be worn by girls as a decorative garment and by both girls and women as a protective apron. A related term is pinafore dress, which is British English for what in American English is known as a jumper dress, i.e. a sleeveless dress intended to be worn over a top or blouse. A key difference between a pinafore and a jumper dress is that the pinafore is open in the back. In informal British usage however, a pinafore dress is sometimes referred to as simply a pinafore, which can lead to confusion.
134 |
The name reflects that the pinafore was formerly pinned (pin) to the front (afore) of a dress. The pinafore had no buttons, was simply "pinned on the front" which led to the term "pinafore."
Pinafores are often confused with smocks. Some languages do not differentiate between these different garments. The pinafore differs from a smock in that it does not have sleeves and there is no back to the bodice. Smocks have both sleeves and a full bodice, both front and back.
137 |
A pinafore is a full apron with two holes for the arms that is tied or buttoned in the back, usually just below the neck. Pinafores have complete front shaped over shoulder while aprons usually have no bib, or only a smaller one. A child's garment to wear at school or for play would be a pinafore.
138 |
Further confusion results from some foreign languages, which, unlike English, do not have a distinctive term for the pinafore. In German, for example, there is no precise term for pinafore. Schürze means "apron" and thus Kinderschürze is used to describe a child's apron or pinafore (in contrast to the German word "Kittelschürze", which refers to an adult garment, typically worn by older women for housework tasks and cleaning).
139 |
In modern times, the term "pinny" or "pinnie" has taken another meaning in sports wear, namely a double-sided short apron, often made of mesh, used to differentiate teams. This usage is chiefly British, with some usage in Canada and the United States. This type of pinny is also known as a scrimmage vest.[citation needed]
The pinafore was a type of apron that was pinned over the dress and easily removed for washing. Buttons were frequently damaged with lye cleaning products, which was one reason why dresses were not laundered very often.
Granville, the errand boy of the British TV series Open All Hours, frequently complains about his having to wear a pinny and his being unable to acquire a modern look because of the pinny.
149 |
United Kingdom television programme Sugar Rush describes one of the main characters Nathan, as "Half man, Half pinny."
Pinafores may be worn by girls as a decorative garment and by both girls and women as a protective apron. A related term is pinafore dress, which is British English for what in American English is known as a jumper dress, i.e. a sleeveless dress intended to be worn over a top or blouse. A key difference between a pinafore and a jumper dress is that the pinafore is open in the back. In informal British usage however, a pinafore dress is sometimes referred to as simply a pinafore, which can lead to confusion.
158 |
The name reflects that the pinafore was formerly pinned (pin) to the front (afore) of a dress. The pinafore had no buttons, was simply "pinned on the front" which led to the term "pinafore."
Pinafores are often confused with smocks. Some languages do not differentiate between these different garments. The pinafore differs from a smock in that it does not have sleeves and there is no back to the bodice. Smocks have both sleeves and a full bodice, both front and back.
161 |
A pinafore is a full apron with two holes for the arms that is tied or buttoned in the back, usually just below the neck. Pinafores have complete front shaped over shoulder while aprons usually have no bib, or only a smaller one. A child's garment to wear at school or for play would be a pinafore.
162 |
Further confusion results from some foreign languages, which, unlike English, do not have a distinctive term for the pinafore. In German, for example, there is no precise term for pinafore. Schürze means "apron" and thus Kinderschürze is used to describe a child's apron or pinafore (in contrast to the German word "Kittelschürze", which refers to an adult garment, typically worn by older women for housework tasks and cleaning).
163 |
In modern times, the term "pinny" or "pinnie" has taken another meaning in sports wear, namely a double-sided short apron, often made of mesh, used to differentiate teams. This usage is chiefly British, with some usage in Canada and the United States. This type of pinny is also known as a scrimmage vest.[citation needed]
The pinafore was a type of apron that was pinned over the dress and easily removed for washing. Buttons were frequently damaged with lye cleaning products, which was one reason why dresses were not laundered very often.
Granville, the errand boy of the British TV series Open All Hours, frequently complains about his having to wear a pinny and his being unable to acquire a modern look because of the pinny.
173 |
United Kingdom television programme Sugar Rush describes one of the main characters Nathan, as "Half man, Half pinny."
Pinafores may be worn by girls as a decorative garment and by both girls and women as a protective apron. A related term is pinafore dress, which is British English for what in American English is known as a jumper dress, i.e. a sleeveless dress intended to be worn over a top or blouse. A key difference between a pinafore and a jumper dress is that the pinafore is open in the back. In informal British usage however, a pinafore dress is sometimes referred to as simply a pinafore, which can lead to confusion.
183 |
The name reflects that the pinafore was formerly pinned (pin) to the front (afore) of a dress. The pinafore had no buttons, was simply "pinned on the front" which led to the term "pinafore."
Pinafores are often confused with smocks. Some languages do not differentiate between these different garments. The pinafore differs from a smock in that it does not have sleeves and there is no back to the bodice. Smocks have both sleeves and a full bodice, both front and back.
186 |
A pinafore is a full apron with two holes for the arms that is tied or buttoned in the back, usually just below the neck. Pinafores have complete front shaped over shoulder while aprons usually have no bib, or only a smaller one. A child's garment to wear at school or for play would be a pinafore.
187 |
Further confusion results from some foreign languages, which, unlike English, do not have a distinctive term for the pinafore. In German, for example, there is no precise term for pinafore. Schürze means "apron" and thus Kinderschürze is used to describe a child's apron or pinafore (in contrast to the German word "Kittelschürze", which refers to an adult garment, typically worn by older women for housework tasks and cleaning).
188 |
In modern times, the term "pinny" or "pinnie" has taken another meaning in sports wear, namely a double-sided short apron, often made of mesh, used to differentiate teams. This usage is chiefly British, with some usage in Canada and the United States. This type of pinny is also known as a scrimmage vest.[citation needed]
The pinafore was a type of apron that was pinned over the dress and easily removed for washing. Buttons were frequently damaged with lye cleaning products, which was one reason why dresses were not laundered very often.
Granville, the errand boy of the British TV series Open All Hours, frequently complains about his having to wear a pinny and his being unable to acquire a modern look because of the pinny.
198 |
United Kingdom television programme Sugar Rush describes one of the main characters Nathan, as "Half man, Half pinny."