Commit
This commit does not belong to any branch on this repository, and may belong to a fork outside of the repository.
The accidental merge of tooltip into master was reverted in master, t…
…hat revert got merged back into tooltip; now reverting that revert to get the tooltip stuff back, should then make it easy to merge into master once tooltip is done
- Loading branch information
1 parent
9230b72
commit 6204e1a
Showing
14 changed files
with
774 additions
and
3 deletions.
There are no files selected for viewing
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Original file line | Diff line number | Diff line change |
---|---|---|---|
@@ -0,0 +1,48 @@ | |||
<!doctype html> | |||
<html lang="en"> | |||
<head> | |||
<title>jQuery UI Tooltip - Default demo</title> | |||
<link type="text/css" href="../../themes/base/jquery.ui.all.css" rel="stylesheet" /> | |||
<script type="text/javascript" src="../../jquery-1.4.2.js"></script> | |||
<script type="text/javascript" src="../../ui/jquery.ui.core.js"></script> | |||
<script type="text/javascript" src="../../ui/jquery.ui.widget.js"></script> | |||
<script type="text/javascript" src="../../ui/jquery.ui.position.js"></script> | |||
<script type="text/javascript" src="../../ui/jquery.ui.tooltip.js"></script> | |||
<link type="text/css" href="../demos.css" rel="stylesheet" /> | |||
<script type="text/javascript"> | |||
$(function() { | |||
$("a, input").tooltip(); | |||
}); | |||
</script> | |||
<style> | |||
label { display: inline-block; width: 5em; } | |||
</style> | |||
</head> | |||
<body> | |||
|
|||
<div class="demo"> | |||
|
|||
<p><a href="#" title="That's what this widget is">Tooltips</a> can be attached to any element. When you hover | |||
the element with your mouse, the title attribute is displayed in a little box next to the element, just like a native tooltip. | |||
</p> | |||
<p>But as it's not a native tooltip, it can be styled. Any themes built with | |||
<a href="http://themeroller.com" title="ThemeRoller, jQuery UI's theme builder application">ThemeRoller</a> | |||
will also style tooltip's accordingly.</p> | |||
<p>Tooltip's are also useful for form elements, to show some additional information in the context of each field.</p> | |||
<p><label for="age">Your age:</label><input id="age" title="We ask for your age only for statistical purposes." /></p> | |||
<p>Click the field to see the tooltip; when you tab out of the field, it gets hidden.</p> | |||
|
|||
</div><!-- End demo --> | |||
|
|||
|
|||
|
|||
<div class="demo-description"> | |||
|
|||
<p>Hover the links above or use the tab key to cycle the focus on each element.</p> | |||
|
|||
</div><!-- End demo-description --> | |||
|
|||
|
|||
|
|||
</body> | |||
</html> |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Original file line | Diff line number | Diff line change |
---|---|---|---|
@@ -0,0 +1,69 @@ | |||
<!doctype html> | |||
<html lang="en"> | |||
<head> | |||
<title>jQuery UI Tooltip - Default demo</title> | |||
<link type="text/css" href="../../themes/base/jquery.ui.all.css" rel="stylesheet" /> | |||
<script type="text/javascript" src="../../jquery-1.4.2.js"></script> | |||
<script type="text/javascript" src="../../ui/jquery.ui.core.js"></script> | |||
<script type="text/javascript" src="../../ui/jquery.ui.widget.js"></script> | |||
<script type="text/javascript" src="../../ui/jquery.ui.position.js"></script> | |||
<script type="text/javascript" src="../../ui/jquery.ui.tooltip.js"></script> | |||
<script type="text/javascript" src="../../ui/jquery.ui.button.js"></script> | |||
<link type="text/css" href="../demos.css" rel="stylesheet" /> | |||
<script type="text/javascript"> | |||
$(function() { | |||
$("[title]").tooltip(); | |||
$("<button/>").text("Show help").button().toggle(function() { | |||
$(":ui-tooltip").tooltip("open"); | |||
}, function() { | |||
$(":ui-tooltip").tooltip("close"); | |||
}).appendTo("form"); | |||
}); | |||
</script> | |||
<style> | |||
label { display: inline-block; width: 5em; } | |||
.ui-icon { display: inline-block; } | |||
fieldset div { | |||
margin-bottom: 2em; | |||
} | |||
.ui-tooltip { width: 200px; } | |||
</style> | |||
</head> | |||
<body> | |||
|
|||
<div class="demo"> | |||
|
|||
<form> | |||
<fieldset> | |||
<div> | |||
<label for="firstname">Firstname</label> | |||
<input id="firstname" name="firstname" /> | |||
<span title="Please provide your firstname." class="ui-state-default ui-corner-all ui-icon ui-icon-help">?</span> | |||
</div> | |||
<div> | |||
<label for="lastname">Lastname</label> | |||
<input id="lastname" name="lastname" /> | |||
<span title="Please provide also your lastname." class="ui-state-default ui-corner-all ui-icon ui-icon-help">?</span> | |||
</div> | |||
<div> | |||
<label for="address">Address</label> | |||
<input id="address" name="address" /> | |||
<span title="Your home or work address." class="ui-state-default ui-corner-all ui-icon ui-icon-help">?</span> | |||
</div> | |||
</fieldset> | |||
</form> | |||
|
|||
</div><!-- End demo --> | |||
|
|||
|
|||
|
|||
<div class="demo-description"> | |||
|
|||
<p>Hover the questionmark-buttons or use the button below to display the help texts all at once. Click again to hide them.</p> | |||
|
|||
</div><!-- End demo-description --> | |||
|
|||
|
|||
|
|||
</body> | |||
</html> |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Original file line | Diff line number | Diff line change |
---|---|---|---|
@@ -0,0 +1,21 @@ | |||
<!doctype html> | |||
<html lang="en"> | |||
<head> | |||
<title>jQuery UI Tooltip Demos</title> | |||
<link type="text/css" href="../demos.css" rel="stylesheet" /> | |||
</head> | |||
<body> | |||
|
|||
<div class="demos-nav"> | |||
<h4>Examples</h4> | |||
<ul> | |||
<li class="demo-config-on"><a href="default.html">Default functionality</a></li> | |||
<!-- | |||
<li><a href="foo.html">Foo</a></li> | |||
<li><a href="bar.html">Bar</a></li> | |||
--> | |||
</ul> | |||
</div> | |||
|
|||
</body> | |||
</html> |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Original file line | Diff line number | Diff line change |
---|---|---|---|
@@ -0,0 +1,65 @@ | |||
<!doctype html> | |||
<html lang="en"> | |||
<head> | |||
<title>jQuery UI Tooltip - Default demo</title> | |||
<link type="text/css" href="../../themes/base/jquery.ui.all.css" rel="stylesheet" /> | |||
<script type="text/javascript" src="../../jquery-1.4.2.js"></script> | |||
<script type="text/javascript" src="../../ui/jquery.ui.core.js"></script> | |||
<script type="text/javascript" src="../../ui/jquery.ui.widget.js"></script> | |||
<script type="text/javascript" src="../../ui/jquery.ui.position.js"></script> | |||
<script type="text/javascript" src="../../ui/jquery.ui.tooltip.js"></script> | |||
<link type="text/css" href="../demos.css" rel="stylesheet" /> | |||
<script type="text/javascript"> | |||
$(function() { | |||
$("a, input").tooltip({ | |||
open: function() { | |||
var tooltip = $(this).tooltip("widget"); | |||
$(document).mousemove(function(event) { | |||
tooltip.position({ | |||
my: "left center", | |||
at: "right center", | |||
offset: "25 25", | |||
of: event | |||
}); | |||
}) | |||
// trigger once to override element-relative positioning | |||
.mousemove(); | |||
}, | |||
close: function() { | |||
$(document).unbind("mousemove"); | |||
} | |||
}); | |||
}); | |||
</script> | |||
<style> | |||
label { display: inline-block; width: 5em; } | |||
</style> | |||
</head> | |||
<body> | |||
|
|||
<div class="demo"> | |||
|
|||
<p><a href="#" title="That's what this widget is">Tooltips</a> can be attached to any element. When you hover | |||
the element with your mouse, the title attribute is displayed in a little box next to the element, just like a native tooltip. | |||
</p> | |||
<p>But as it's not a native tooltip, it can be styled. Any themes built with | |||
<a href="http://themeroller.com" title="ThemeRoller, jQuery UI's theme builder application">ThemeRoller</a> | |||
will also style tooltip's accordingly.</p> | |||
<p>Tooltip's are also useful for form elements, to show some additional information in the context of each field.</p> | |||
<p><label for="age">Your age:</label><input id="age" title="We ask for your age only for statistical purposes." /></p> | |||
<p>Click the field to see the tooltip; when you tab out of the field, it gets hidden.</p> | |||
|
|||
</div><!-- End demo --> | |||
|
|||
|
|||
|
|||
<div class="demo-description"> | |||
|
|||
<p>Here the tooltips are positioned relative to the mouse, and follow the mouse while it moves above the element.</p> | |||
|
|||
</div><!-- End demo-description --> | |||
|
|||
|
|||
|
|||
</body> | |||
</html> |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Original file line | Diff line number | Diff line change |
---|---|---|---|
@@ -0,0 +1,37 @@ | |||
<!DOCTYPE html> | |||
<html lang="en"> | |||
<head> | |||
<meta charset="UTF-8" /> | |||
<title>Compound Visual Test : Tabs in Tabs</title> | |||
<link rel="stylesheet" href="../visual.css" type="text/css" /> | |||
<link rel="stylesheet" href="../../../themes/base/jquery.ui.all.css" type="text/css"> | |||
<script type="text/javascript" src="../../../jquery-1.4.2.js"></script> | |||
<script type="text/javascript" src="../../../ui/jquery.ui.core.js"></script> | |||
<script type="text/javascript" src="../../../ui/jquery.ui.widget.js"></script> | |||
<script type="text/javascript" src="../../../ui/jquery.ui.position.js"></script> | |||
<script type="text/javascript" src="../../../ui/jquery.ui.tooltip.js"></script> | |||
<script type="text/javascript" src="../../../ui/jquery.ui.tabs.js"></script> | |||
<script type="text/javascript"> | |||
$(function() { | |||
$("#tabs").tabs(); | |||
$("a").tooltip(); | |||
}); | |||
</script> | |||
</head> | |||
<body> | |||
|
|||
<div id="tabs"> | |||
<ul> | |||
<li><a href="#tabs-1" title="first tab tooltip">First</a></li> | |||
<li><a href="#tabs-2" title="second tab tooltip">Second</a></li> | |||
</ul> | |||
<div id="tabs-1"> | |||
<a href="#" title="title content">label</a> | |||
</div> | |||
<div id="tabs-2"> | |||
<a href="#" title="other title content">other label</a> | |||
</div> | |||
</div> | |||
|
|||
</body> | |||
</html> |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Original file line | Diff line number | Diff line change |
---|---|---|---|
@@ -0,0 +1,2 @@ | |||
<?php sleep(1); ?> | |||
<strong>Hello</strong> world! |
Oops, something went wrong.