diff options
Diffstat (limited to '97suifangqa/staticfiles/plugins/jquery-ui/demos/tooltip/forms.html')
| -rw-r--r-- | 97suifangqa/staticfiles/plugins/jquery-ui/demos/tooltip/forms.html | 65 | 
1 files changed, 65 insertions, 0 deletions
| diff --git a/97suifangqa/staticfiles/plugins/jquery-ui/demos/tooltip/forms.html b/97suifangqa/staticfiles/plugins/jquery-ui/demos/tooltip/forms.html new file mode 100644 index 0000000..a5ce77f --- /dev/null +++ b/97suifangqa/staticfiles/plugins/jquery-ui/demos/tooltip/forms.html @@ -0,0 +1,65 @@ +<!doctype html> +<html lang="en"> +<head> +	<meta charset="utf-8"> +	<title>jQuery UI Tooltip - Forms</title> +	<link rel="stylesheet" href="../../themes/base/jquery.ui.all.css"> +	<script src="../../jquery-1.9.1.js"></script> +	<script src="../../ui/jquery.ui.core.js"></script> +	<script src="../../ui/jquery.ui.widget.js"></script> +	<script src="../../ui/jquery.ui.position.js"></script> +	<script src="../../ui/jquery.ui.tooltip.js"></script> +	<script src="../../ui/jquery.ui.button.js"></script> +	<link rel="stylesheet" href="../demos.css"> +	<style> +	label { +		display: inline-block; width: 5em; +	} +	fieldset div { +		margin-bottom: 2em; +	} +	fieldset .help { +		display: inline-block; +	} +	.ui-tooltip { +		width: 210px; +	} +	</style> +	<script> +	$(function() { +		var tooltips = $( "[title]" ).tooltip(); +		$( "<button>" ) +			.text( "Show help" ) +			.button() +			.click(function() { +				tooltips.tooltip( "open" ); +			}) +			.insertAfter( "form" ); +	}); +	</script> +</head> +<body> + +<form> +	<fieldset> +		<div> +			<label for="firstname">Firstname</label> +			<input id="firstname" name="firstname" title="Please provide your firstname."> +		</div> +		<div> +			<label for="lastname">Lastname</label> +			<input id="lastname" name="lastname" title="Please provide also your lastname."> +		</div> +		<div> +			<label for="address">Address</label> +			<input id="address" name="address" title="Your home or work address."> +		</div> +	</fieldset> +</form> + +<div class="demo-description"> +<p>Use the button below to display the help texts, or just focus or mouseover the indivdual inputs.</p> +<p>A fixed width is defined in CSS to make the tooltips look consistent when displayed all at once.</p> +</div> +</body> +</html> | 
