jQuery 入门教程(27): jQuery UI Button示例（二）
本例为使用jQuery的一个实用的例子，显示媒体播放器的控制条。其中按钮的图标使用jQuery库自带的CSS定义的一些图标（比如ui-icon-seek-end等）。
1 <!doctype html>
2 <html lang="en">
3 <head>
4 <meta charset="utf-8" />
5 <title>jQuery UI Demos</title>
6 <link rel="stylesheet" href="themes/trontastic/jquery-ui.css" />
7 <script src="scripts/jquery-1.9.1.js"></script>
8 <script src="scripts/jquery-ui-1.10.1.custom.js"></script>
9 <style>
10 #toolbar {
11 padding: 4px;
12 display: inline-block;
13 }
14 /* support: IE7 */
15 * + html #toolbar {
16 display: inline;
17 }
18 </style>
19 <script>
20 $(function () {
21 $("#beginning").button({
22 text: false,
23 icons: {
24 primary: "ui-icon-seek-start"
25 }
26 });
27 $("#rewind").button({
28 text: false,
29 icons: {
30 primary: "ui-icon-seek-prev"
31 }
32 });
33 $("#play").button({
34 text: false,
35 icons: {
36 primary: "ui-icon-play"
37 }
38 })
39 .click(function () {
40 var options;
41 if ($(this).text() === "play") {
42 options = {
43 label: "pause",
44 icons: {
45 primary: "ui-icon-pause"
46 }
47 };
48 } else {
49 options = {
50 label: "play",
51 icons: {
52 primary: "ui-icon-play"
53 }
54 };
55 }
56 $(this).button("option", options);
57 });
58 $("#stop").button({
59 text: false,
60 icons: {
61 primary: "ui-icon-stop"
62 }
63 })
64 .click(function () {
65 $("#play").button("option", {
66 label: "play",
67 icons: {
68 primary: "ui-icon-play"
69
补充：web前端 , JavaScript ,
