You signed in with another tab or window. Reload to refresh your session.You signed out in another tab or window. Reload to refresh your session.You switched accounts on another tab or window. Reload to refresh your session.Dismiss alert
Copy file name to clipboardExpand all lines: page/code-organization/deferreds/examples.md
+1-1
Original file line number
Diff line number
Diff line change
@@ -158,7 +158,7 @@ The new `$.afterDOMReady()` helper method provides proper timing after the DOM i
158
158
159
159
While jQuery offers all the event binding one may need, it can become a bit cumbersome to handle events that are only supposed to be dealt with once.
160
160
161
-
For instance, you may wish to have a button that will open a panel the first time it is clicked and leave it open afterwards or take special initialization actions the first time said button is clicked. When dealing with such a situation, one usually end up with code like this:
161
+
For instance, you may wish to have a button that will open a panel the first time it is clicked and leave it open afterward or take special initialization actions the first time said button is clicked. When dealing with such a situation, one usually ends up with code like this:
Copy file name to clipboardExpand all lines: page/events/event-extensions.md
+1-1
Original file line number
Diff line number
Diff line change
@@ -7,7 +7,7 @@ jQuery offers several ways to extend its event system to provide custom function
7
7
8
8
This document covers the extensions available starting with jQuery 1.7; a sparsely documented subset of this functionality has been available since jQuery 1.3 but the differences in functionality are extensive. For an overview of special events in earlier versions, see [Ben Alman's jQuery Special Events](http://benalman.com/news/2010/03/jquery-special-events/) article.
9
9
10
-
<divclass="warning">**Note:** jQuery event extensions are an advanced feature; they require deeper knowledge of both browser behavior and jQuery internals than most of the API. Most users of jQuery will not need to use event extensions, and those who do should use them with care. For example, on a large project with third-party plugins, changing the behavior of standard events such as `click` or `mouseover` can cause serious compatibility issues.</div>
10
+
<divclass="warning">**Note:** jQuery event extensions are an advanced feature; they require a deeper knowledge of both browser behavior and jQuery internals than most of the API. Most users of jQuery will not need to use event extensions, and those who do should use them with care. For example, on a large project with third-party plugins, changing the behavior of standard events such as `click` or `mouseover` can cause serious compatibility issues.</div>
Copy file name to clipboardExpand all lines: page/events/introduction-to-events.md
+1-1
Original file line number
Diff line number
Diff line change
@@ -131,7 +131,7 @@ In this slightly different example, we're defining a function called `sayHello`
131
131
132
132
But what about that `event` argument in the `sayHello` function — what is it and why does it matter? In all DOM event callbacks, jQuery passes an *event object* argument which contains information about the event, such as precisely when and where it occurred, what type of event it was, which element the event occurred on, and a plethora of other information. Of course you don't have to call it `event`; you could call it `e` or whatever you want to, but `event` is a pretty common convention.
133
133
134
-
If the element has default functionality for a specific event (like a link opens a new page, a button in a form submits the form, etc.), that default functionality can be cancelled. This is often useful for Ajax requests. When a user clicks on a button to submit a form via Ajax, we'd want to cancel the button/form's default action (to submit it to the form's `action` attribute), and we would instead do an Ajax request to accomplish the same task for a more seamless experience. To do this, we would utilize the event object and call its `.preventDefault()` method. We can also prevent the event from bubbling up the DOM tree using `.stopPropagation()` so that parent elements aren't notified of its occurrence (in the case that event delegation is being used).
134
+
If the element has default functionality for a specific event (like a link opens a new page, a button in a form submits the form, etc.), that default functionality can be canceled. This is often useful for Ajax requests. When a user clicks on a button to submit a form via Ajax, we'd want to cancel the button/form's default action (to submit it to the form's `action` attribute), and we would instead do an Ajax request to accomplish the same task for a more seamless experience. To do this, we would utilize the event object and call its `.preventDefault()` method. We can also prevent the event from bubbling up the DOM tree using `.stopPropagation()` so that parent elements aren't notified of its occurrence (in the case that event delegation is being used).
135
135
136
136
```
137
137
// Preventing a default action from occurring and stopping the event bubbling
Copy file name to clipboardExpand all lines: page/jquery-mobile/theme-roller.md
+2-2
Original file line number
Diff line number
Diff line change
@@ -35,11 +35,11 @@ The easiest way to create custom themes is with the ThemeRoller tool. It allows
35
35
36
36
### Creating the Theme Swatches
37
37
38
-
The [ThemeRoller](http://jquerymobile.com/themeroller/) allows users to create their own theme through an easy to use drag and drop interface. By default, ThemeRoller offers three swatches (a, b and c). You can use the offered default colors, the Adobe kuler colors, or create your own. You will create your theme by dragging the chosen color onto the chosen element in the swatch of your choice. You can add more swatches by pressing the "+" sign near the "A", "B", and "C" tabs, in the left-hand side menu.
38
+
The [ThemeRoller](http://jquerymobile.com/themeroller/) allows users to create their own theme through an easy to use drag and drop interface. By default, ThemeRoller offers three swatches (a, b and c). You can use the offered default colors, the Adobe Kuler colors, or create your own. You will create your theme by dragging the chosen color onto the chosen element in the swatch of your choice. You can add more swatches by pressing the "+" sign near the "A", "B", and "C" tabs, in the left-hand side menu.
39
39
40
40
You can further edit your swatch from the menu. For example, you can expand the various element parts and carry out detailed editing. This will allow you to change text color, text shadow size, position and color, etc. You can also edit the gradient used on each element.
41
41
42
-
Here are two examples of theme swatches created, one with the default colors, and one with the kuler colors:
42
+
Here are two examples of theme swatches created, one with the default colors, and one with the Kuler colors:
Copy file name to clipboardExpand all lines: page/jquery-ui/environments/bower.md
+6-6
Original file line number
Diff line number
Diff line change
@@ -35,13 +35,13 @@ As an example, suppose we're starting a new project and we need to use [jQuery U
35
35
</html>
36
36
```
37
37
38
-
This examples fails with a JavaScript error because neither jQuery core nor jQuery UI are loaded. Let's load them with Bower.
38
+
This example fails with a JavaScript error because neither jQuery core nor jQuery UI are loaded. Let's load them with Bower.
39
39
40
40
### Downloading jQuery UI With Bower
41
41
42
42
Libraries are downloaded with Bower using the `bower install` command. To install jQuery UI, run `bower install jquery-ui`. Doing so creates the following (simplified) directory structure.
43
43
44
-
*Note: If you get an error that the `bower` command is not found, checkout[Bower's installation instructions](http://bower.io/#installing-bower).*
44
+
*Note: If you get an error that the `bower` command is not found, check out[Bower's installation instructions](http://bower.io/#installing-bower).*
45
45
46
46
<pre>
47
47
.
@@ -85,7 +85,7 @@ We have a few different options for using the files downloaded with Bower. The e
@@ -140,4 +140,4 @@ Because Bower also downloaded jQuery UI's individual source files, we can altern
140
140
</html>
141
141
```
142
142
143
-
From here, you can hook jQuery UI's files into your own custom build system to concatenate and minify your resources for production. If you're a RequireJS user, checkout our [guide on how to use jQuery UI with AMD](/jquery-ui/environments/amd/).
143
+
From here, you can hook jQuery UI's files into your own custom build system to concatenate and minify your resources for production. If you're a RequireJS user, check out our [guide on how to use jQuery UI with AMD](/jquery-ui/environments/amd/).
Copy file name to clipboardExpand all lines: page/jquery-ui/theming.md
+1-1
Original file line number
Diff line number
Diff line change
@@ -5,7 +5,7 @@
5
5
6
6
All jQuery UI plugins are designed to allow a developer to seamlessly integrate UI widgets into the look and feel of their site or application. Each plugin is styled with CSS and contains two layers of style information: standard [jQuery UI CSS Framework](http://api.jqueryui.com/theming/css-framework/) styles and plugin-specific styles.
7
7
8
-
The jQuery UI CSS Framework provide semantic presentation classes to indicate the role of an element within a widget such as a header, content area, or clickable region. These are applied consistently across all widgets so a clickable tab, accordion, or button will all have the same `ui-state-default` class applied to indicate that it is clickable. When a user mouses over one of these elements, this class is changed to `ui-state-hover`, then `ui-state-active` when selected. This level of class consistency makes it easy to ensure that all elements with a similar role or interaction state will look the same across all widgets.
8
+
The jQuery UI CSS Framework provides semantic presentation classes to indicate the role of an element within a widget such as a header, content area, or clickable region. These are applied consistently across all widgets so a clickable tab, accordion, or button will all have the same `ui-state-default` class applied to indicate that it is clickable. When a user mouses over one of these elements, this class is changed to `ui-state-hover`, then `ui-state-active` when selected. This level of class consistency makes it easy to ensure that all elements with a similar role or interaction state will look the same across all widgets.
9
9
10
10
The CSS Framework styles are encapsulated in a single file called `theme.css` and this is the file modified by the [ThemeRoller](/jquery-ui/themeroller/) application. Framework styles only include attributes that affect the look and feel (primarily color, background images, and icons) so these are "safe" styles that will not affect functionality of individual plugins. This separation means that a developer can create a custom look and feel by modifying the colors and images in the `theme.css` file and know that as future plugins or bug fixes become available, these should work with the theme without modification.
The widget factory is only one way of creating stateful plugins. There are a few different models that can be used and each have their own advantages and disadvantages. The widget factory solves lots of common problems for you and can greatly improve productivity, it also greatly improves code reuse, making it a great fit for jQuery UI as well as many other stateful plugins.
302
+
The widget factory is only one way of creating stateful plugins. There are a few different models that can be used and each has their own advantages and disadvantages. The widget factory solves lots of common problems for you and can greatly improve productivity, it also greatly improves code reuse, making it a great fit for jQuery UI as well as many other stateful plugins.
303
303
304
304
You may have noticed that in this article we used the `custom` namespace. The `ui` namespace is reserved for official jQuery UI plugins. When building your own plugins, you should create your own namespace. This makes it clear where the plugin came from and if it is part of a larger collection.
To allow users to access and even manipulate those information, you can store them in a variable containing the settings of your plugin. A better implementation of the previous code is shown below:
248
+
To allow users to access and even manipulate that information, you can store it in a variable containing the settings of your plugin. A better implementation of the previous code is shown below:
Copy file name to clipboardExpand all lines: page/plugins/basic-plugin-creation.md
+1-1
Original file line number
Diff line number
Diff line change
@@ -33,7 +33,7 @@ Notice that to use `.css()`, another method, we use `this`, not `$( this )`. Thi
33
33
34
34
## Chaining
35
35
36
-
This works, but there's a couple of things we need to do for our plugin to survive in the real world. One of jQuery's features is chaining, when you link five or six actions onto one selector. This is accomplished by having all jQuery object methods return the original jQuery object again (there are a few exceptions: `.width()` called without parameters returns the width of the selected element, and is not chainable). Making our plugin method chainable takes one line of code:
36
+
This works, but there are a couple of things we need to do for our plugin to survive in the real world. One of jQuery's features is chaining, when you link five or six actions onto one selector. This is accomplished by having all jQuery object methods return the original jQuery object again (there are a few exceptions: `.width()` called without parameters returns the width of the selected element, and is not chainable). Making our plugin method chainable takes one line of code:
0 commit comments