|
1 | | -<!DOCTYPE html> |
| 1 | +<!doctype html> |
2 | 2 | <html lang="en"> |
3 | 3 | <head> |
4 | 4 | <meta charset="utf-8"> |
5 | | - <title>Tooltip Visual Test: Default</title> |
6 | | - <link rel="stylesheet" href="../visual.css" type="text/css" /> |
7 | | - <link rel="stylesheet" href="../../../themes/base/jquery.ui.all.css" type="text/css"> |
8 | | - <script type="text/javascript" src="../../../jquery-1.7.2.js"></script> |
9 | | - <script type="text/javascript" src="../../../ui/jquery.ui.core.js"></script> |
10 | | - <script type="text/javascript" src="../../../ui/jquery.ui.widget.js"></script> |
11 | | - <script type="text/javascript" src="../../../ui/jquery.ui.position.js"></script> |
12 | | - <script type="text/javascript" src="../../../ui/jquery.ui.button.js"></script> |
13 | | - <script type="text/javascript" src="../../../ui/jquery.ui.tooltip.js"></script> |
14 | | - <script type="text/javascript" src="../../../ui/jquery.effects.core.js"></script> |
15 | | - <script type="text/javascript" src="../../../ui/jquery.effects.blind.js"></script> |
16 | | - <script type="text/javascript" src="../../../ui/jquery.effects.bounce.js"></script> |
17 | | - <script type="text/javascript" src="../../../ui/jquery.effects.drop.js"></script> |
18 | | - <script type="text/javascript" src="../../../ui/jquery.effects.explode.js"></script> |
19 | | - <!-- |
20 | | - <script type="text/javascript" src="http://jqueryui.com/themeroller/themeswitchertool/"></script> |
21 | | - --> |
22 | | - <script type="text/javascript"> |
| 5 | + <title>Tooltip Visual Test: Animations</title> |
| 6 | + <link rel="stylesheet" href="../../../themes/base/jquery.ui.all.css"> |
| 7 | + <script src="../../../jquery-1.7.2.js"></script> |
| 8 | + <script src="../../../ui/jquery.ui.core.js"></script> |
| 9 | + <script src="../../../ui/jquery.ui.widget.js"></script> |
| 10 | + <script src="../../../ui/jquery.ui.position.js"></script> |
| 11 | + <script src="../../../ui/jquery.ui.tooltip.js"></script> |
| 12 | + <script src="../../../ui/jquery.effects.core.js"></script> |
| 13 | + <script src="../../../ui/jquery.effects.blind.js"></script> |
| 14 | + <script src="../../../ui/jquery.effects.bounce.js"></script> |
| 15 | + <script src="../../../ui/jquery.effects.drop.js"></script> |
| 16 | + <script src="../../../ui/jquery.effects.explode.js"></script> |
| 17 | + <style> |
| 18 | + pre { |
| 19 | + width: 250px; |
| 20 | + border: 1px solid #000; |
| 21 | + padding: .5em; |
| 22 | + } |
| 23 | + </style> |
| 24 | + <script> |
23 | 25 | $(function() { |
24 | | - var animations = [{}, { |
25 | | - show: { |
26 | | - effect: "slideDown" |
27 | | - }, |
28 | | - hide: { |
29 | | - effect: "slideUp" |
30 | | - } |
31 | | - }, { |
32 | | - show: { |
33 | | - effect: "explode" |
34 | | - }, |
35 | | - hide: { |
36 | | - effect: "explode" |
37 | | - } |
38 | | - }, { |
39 | | - show: { |
40 | | - effect: "bounce" |
41 | | - }, |
42 | | - hide: { |
43 | | - effect: "blind" |
44 | | - } |
45 | | - }, |
46 | | - { |
47 | | - show: { |
48 | | - effect: "drop", |
49 | | - direction: "right" |
50 | | - }, |
51 | | - hide: { |
52 | | - effect: "drop", |
53 | | - direction: "right" |
54 | | - } |
55 | | - }]; |
56 | | - $.each(animations, function(index, animation) { |
57 | | - var text = JSON.stringify(animation); |
58 | | - $("<span></span>").attr("title", text).text(text).tooltip({ |
59 | | - show: animation.show, |
60 | | - hide: animation.hide |
61 | | - }).wrap("<li></li>").parent().appendTo("ul"); |
| 26 | + $( "pre" ).each(function( index, elem ) { |
| 27 | + $( elem ) |
| 28 | + .attr( "title", "animated tooltips" ) |
| 29 | + .tooltip( $.parseJSON( $( elem ).text() ) ); |
62 | 30 | }); |
63 | 31 | }); |
64 | 32 | </script> |
65 | 33 | </head> |
66 | 34 | <body> |
67 | 35 |
|
68 | | -<div style="width:300px"> |
69 | | - <ul class="ui-widget ui-widget-header"> |
70 | | - </ul> |
71 | | -</div> |
| 36 | +<pre>{}</pre> |
| 37 | +<pre>{ |
| 38 | + "show": { |
| 39 | + "effect": "slideDown" |
| 40 | + }, |
| 41 | + "hide": { |
| 42 | + "effect": "slideUp" |
| 43 | + } |
| 44 | +}</pre> |
| 45 | +<pre>{ |
| 46 | + "show": { |
| 47 | + "effect": "explode" |
| 48 | + }, |
| 49 | + "hide": { |
| 50 | + "effect": "explode" |
| 51 | + } |
| 52 | +}</pre> |
| 53 | +<pre>{ |
| 54 | + "show": { |
| 55 | + "effect": "bounce" |
| 56 | + }, |
| 57 | + "hide": { |
| 58 | + "effect": "blind" |
| 59 | + } |
| 60 | +}</pre> |
| 61 | +<pre>{ |
| 62 | + "show": { |
| 63 | + "effect": "drop", |
| 64 | + "direction": "right" |
| 65 | + }, |
| 66 | + "hide": { |
| 67 | + "effect": "drop", |
| 68 | + "direction": "right" |
| 69 | + } |
| 70 | +}</pre> |
| 71 | + |
72 | 72 | </body> |
73 | 73 | </html> |
0 commit comments