Throbber (aka loading animation) 介绍
Throbber creates a loading animation for jQuery, ready to be used in your AJAX
applications. Of course, the throbber is not limited to AJAX but can also be
triggered manually.
Using the plugin is easy:
$("#button").throbber("click");
adds a loading animation (›throbber‹) to the DOM node with the ID ›button‹
which shows up when a click event is triggered.
The following is a list of all functions provided by the plugin:
-
$().throbber();
$().throbber(event);
$().throbber(options);
$().throbber(event, options);
event is a string specifying the event to which the throbber should bind. The
default here is ›click‹. options is a set of options (see below). Both
parameters can be omitted -
$.throbberShow(options);
Immediately shows a throbber as specified. If no parent element is specified
with options.parent, the throbber will be appended to the element. -
$.throbberHide();
Hide all throbbers.
Options
The plugin recognizes several options which are denoted in curly brackets.
- ajax: ›true‹ if the throbbers should listen to AJAX events. In this case, the throbbers are automatically hidden if all AJAX requests are completed. ›false‹ if you use AJAX, but want to hide the throbbers manually. Default: ›true‹
- delay: The timeout (in milliseconds) until the throbber should appear. Default: ›0‹
- image: The filename of the throbber image. Default: ›throbber.gif‹
- parent: A jQuery selector specifying the parent element to which the throbber should be appended. All other child elements are automatically hidden when the throbber is appended. If this is left blank, the throbber replaces the element to which it was attached. Default: ›‹
- wrap: The HTML code that should wrap the throbber. Default: ›‹
Tips
If you don’t use AJAX, you don’t have to explicitly set the ›ajax‹ parameter
to ›false‹. ›ajax‹ is merely present to prevent that manually created
throbbers are hidden upon completion of AJAX requests.
The throbber element uses this HTML code:
<img src="throbber.gif" class="throbber" />
You can set wrapping code using the ›wrap‹ option.
You can create throbber images using http://www.ajaxload.info/.
Examples
-
$("#button").throbber();
Show a throbber when the button is clicked, replacing the button and stopping
when all AJAX requests are completed. -
$("#div").throbber("dblclick", {image: "throbber_2.gif"});
Show a throbber when #div is double-clicked, using a custom throbber image.
License
Throbber is licensed under the GNU Lesser General Public License.
Throbber (aka loading animation) 官网
http://plugins.jquery.com/project/throbber
版权声明:本文内容由互联网用户自发贡献,该文观点与技术仅代表作者本人。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如发现本站有涉嫌侵权/违法违规的内容, 请发送邮件至 [email protected] 举报,一经查实,本站将立刻删除。