diff options
author | Scott González <scott.gonzalez@gmail.com> | 2011-08-07 11:34:28 -0400 |
---|---|---|
committer | Scott González <scott.gonzalez@gmail.com> | 2011-08-07 11:34:28 -0400 |
commit | 71735652f5c92a2aeda02732c42b71fe0253f5fd (patch) | |
tree | c47cec54083d1b343fe9038e2cfda93c4d0620b5 | |
parent | 051b9e07d9f15a7ee81b9ada1648615cbb85aad9 (diff) | |
download | jquery-ui-71735652f5c92a2aeda02732c42b71fe0253f5fd.tar.gz jquery-ui-71735652f5c92a2aeda02732c42b71fe0253f5fd.zip |
Spinner demos: Fixed line endings.
-rw-r--r-- | demos/spinner/currency.html | 122 | ||||
-rw-r--r-- | demos/spinner/decimal.html | 118 | ||||
-rw-r--r-- | demos/spinner/default.html | 130 | ||||
-rw-r--r-- | demos/spinner/index.html | 40 | ||||
-rw-r--r-- | demos/spinner/latlong.html | 120 | ||||
-rw-r--r-- | demos/spinner/overflow.html | 94 | ||||
-rw-r--r-- | demos/spinner/time.html | 142 |
7 files changed, 383 insertions, 383 deletions
diff --git a/demos/spinner/currency.html b/demos/spinner/currency.html index cb5528dda..a1768ff49 100644 --- a/demos/spinner/currency.html +++ b/demos/spinner/currency.html @@ -1,61 +1,61 @@ -<!DOCTYPE html>
-<html lang="en">
-<head>
- <meta charset="utf-8">
- <title>jQuery UI Spinner - Default functionality</title>
- <link type="text/css" href="../../themes/base/jquery.ui.all.css" rel="stylesheet" />
- <script type="text/javascript" src="../../jquery-1.6.2.js"></script>
- <script type="text/javascript" src="../../external/jquery.mousewheel-3.0.4.js"></script>
- <script type="text/javascript" src="../../external/jquery.global.js"></script>
- <script type="text/javascript" src="../../external/jquery.global.de-DE.js"></script>
- <script type="text/javascript" src="../../external/jquery.global.ja-JP.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.button.js"></script>
- <script type="text/javascript" src="../../ui/jquery.ui.spinner.js"></script>
- <link type="text/css" href="../demos.css" rel="stylesheet" />
- <script type="text/javascript">
- $(function() {
- $("#currency").change(function() {
- var current = $("#spinner").spinner("value");
- $.global.preferCulture($(this).val());
- $("#spinner").spinner("value", current);
- })
-
- $("#spinner").spinner({
- min: 5,
- max: 2500,
- step: 25,
- start: 1000,
- numberFormat: "C"
- });
-
- });
- </script>
-</head>
-<body>
-
-<div class="demo">
-
-<p>
- <label for="currency">Currency to donate</label>
- <select id="currency" name="currency">
- <option value="en-US">US $</option>
- <option value="de-DE">EUR €</option>
- <option value="ja-JP">YEN ¥</option>
- </select>
-</p>
-<p>
- <label for="spinner">Amount to donate:</label>
- <input id="spinner" name="spinner" value="5" />
-</p>
-</div>
-
-<div class="demo-description">
-<p>
- Example of a donation form, with currency selection and amout spinner.
-</p>
-</div>
-
-</body>
-</html>
+<!DOCTYPE html> +<html lang="en"> +<head> + <meta charset="utf-8"> + <title>jQuery UI Spinner - Default functionality</title> + <link type="text/css" href="../../themes/base/jquery.ui.all.css" rel="stylesheet" /> + <script type="text/javascript" src="../../jquery-1.6.2.js"></script> + <script type="text/javascript" src="../../external/jquery.mousewheel-3.0.4.js"></script> + <script type="text/javascript" src="../../external/jquery.global.js"></script> + <script type="text/javascript" src="../../external/jquery.global.de-DE.js"></script> + <script type="text/javascript" src="../../external/jquery.global.ja-JP.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.button.js"></script> + <script type="text/javascript" src="../../ui/jquery.ui.spinner.js"></script> + <link type="text/css" href="../demos.css" rel="stylesheet" /> + <script type="text/javascript"> + $(function() { + $("#currency").change(function() { + var current = $("#spinner").spinner("value"); + $.global.preferCulture($(this).val()); + $("#spinner").spinner("value", current); + }) + + $("#spinner").spinner({ + min: 5, + max: 2500, + step: 25, + start: 1000, + numberFormat: "C" + }); + + }); + </script> +</head> +<body> + +<div class="demo"> + +<p> + <label for="currency">Currency to donate</label> + <select id="currency" name="currency"> + <option value="en-US">US $</option> + <option value="de-DE">EUR €</option> + <option value="ja-JP">YEN ¥</option> + </select> +</p> +<p> + <label for="spinner">Amount to donate:</label> + <input id="spinner" name="spinner" value="5" /> +</p> +</div> + +<div class="demo-description"> +<p> + Example of a donation form, with currency selection and amout spinner. +</p> +</div> + +</body> +</html> diff --git a/demos/spinner/decimal.html b/demos/spinner/decimal.html index bcbc24751..0444aa104 100644 --- a/demos/spinner/decimal.html +++ b/demos/spinner/decimal.html @@ -1,59 +1,59 @@ -<!DOCTYPE html>
-<html lang="en">
-<head>
- <meta charset="utf-8">
- <title>jQuery UI Spinner - decimal</title>
- <link type="text/css" href="../../themes/base/jquery.ui.all.css" rel="stylesheet" />
- <script type="text/javascript" src="../../jquery-1.6.2.js"></script>
- <script type="text/javascript" src="../../external/jquery.mousewheel-3.0.4.js"></script>
- <script type="text/javascript" src="../../external/jquery.global.js"></script>
- <script type="text/javascript" src="../../external/jquery.global.de-DE.js"></script>
- <script type="text/javascript" src="../../external/jquery.global.ja-JP.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.button.js"></script>
- <script type="text/javascript" src="../../ui/jquery.ui.spinner.js"></script>
- <link type="text/css" href="../demos.css" rel="stylesheet" />
- <script type="text/javascript">
- $(function() {
- $("#spinner").spinner({
- step: 0.01,
- numberFormat: "n"
- });
-
- $("#culture").change(function() {
- var current = $("#spinner").spinner("value");
- $.global.preferCulture($(this).val());
- $("#spinner").spinner("value", current);
- })
- });
- </script>
-</head>
-<body>
-
-<div class="demo">
-<p>
- <label for="spinner">Decimal spinner:</label>
- <input id="spinner" name="spinner" value="5.06" />
-</p>
-<p>
- <label for="culture">Select a culture to use for formatting:</label>
- <select id="culture">
- <option value="en-EN" selected="selected">English</option>
- <option value="de-DE">German</option>
- <option value="ja-JP">Japanese</option>
- </select>
-</p>
-</div>
-
-<div class="demo-description">
-<p>
- Example of a decimal spinner. Step is set to 0.01.
- <br/>The code handling the culture change reads the current spinner value,
- then changes the culture, then sets the value again, resulting in an updated
- formatting, based on the new culture.
-</p>
-</div>
-
-</body>
-</html>
+<!DOCTYPE html> +<html lang="en"> +<head> + <meta charset="utf-8"> + <title>jQuery UI Spinner - decimal</title> + <link type="text/css" href="../../themes/base/jquery.ui.all.css" rel="stylesheet" /> + <script type="text/javascript" src="../../jquery-1.6.2.js"></script> + <script type="text/javascript" src="../../external/jquery.mousewheel-3.0.4.js"></script> + <script type="text/javascript" src="../../external/jquery.global.js"></script> + <script type="text/javascript" src="../../external/jquery.global.de-DE.js"></script> + <script type="text/javascript" src="../../external/jquery.global.ja-JP.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.button.js"></script> + <script type="text/javascript" src="../../ui/jquery.ui.spinner.js"></script> + <link type="text/css" href="../demos.css" rel="stylesheet" /> + <script type="text/javascript"> + $(function() { + $("#spinner").spinner({ + step: 0.01, + numberFormat: "n" + }); + + $("#culture").change(function() { + var current = $("#spinner").spinner("value"); + $.global.preferCulture($(this).val()); + $("#spinner").spinner("value", current); + }) + }); + </script> +</head> +<body> + +<div class="demo"> +<p> + <label for="spinner">Decimal spinner:</label> + <input id="spinner" name="spinner" value="5.06" /> +</p> +<p> + <label for="culture">Select a culture to use for formatting:</label> + <select id="culture"> + <option value="en-EN" selected="selected">English</option> + <option value="de-DE">German</option> + <option value="ja-JP">Japanese</option> + </select> +</p> +</div> + +<div class="demo-description"> +<p> + Example of a decimal spinner. Step is set to 0.01. + <br/>The code handling the culture change reads the current spinner value, + then changes the culture, then sets the value again, resulting in an updated + formatting, based on the new culture. +</p> +</div> + +</body> +</html> diff --git a/demos/spinner/default.html b/demos/spinner/default.html index 4035ee41c..35445a0e1 100644 --- a/demos/spinner/default.html +++ b/demos/spinner/default.html @@ -1,65 +1,65 @@ -<!DOCTYPE html>
-<html lang="en">
-<head>
- <meta charset="utf-8">
- <title>jQuery UI Spinner - Default functionality</title>
- <link type="text/css" href="../../themes/base/jquery.ui.all.css" rel="stylesheet" />
- <script type="text/javascript" src="../../jquery-1.6.2.js"></script>
- <script type="text/javascript" src="../../external/jquery.mousewheel-3.0.4.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.button.js"></script>
- <script type="text/javascript" src="../../ui/jquery.ui.spinner.js"></script>
- <link type="text/css" href="../demos.css" rel="stylesheet" />
- <script type="text/javascript">
- $(function() {
- $("#spinner").spinner();
-
- $("#disable").toggle(function() {
- $("#spinner").spinner("disable");
- }, function() {
- $("#spinner").spinner("enable");
- });
- $("#destroy").toggle(function() {
- $("#spinner").spinner("destroy");
- }, function() {
- $("#spinner").spinner();
- });
- $("#getvalue").click(function() {
- alert($("#spinner").spinner("value"));
- });
- $("#setvalue").click(function() {
- $("#spinner").spinner("value", 5);
- });
-
- $("button").button();
- });
- </script>
-</head>
-<body>
-
-<div class="demo">
-
-<p><label for="spinner">Select a value:</label>
-<input id="spinner" name="value" /></p>
-
-<p>
-<button id="disable">Toggle disable/enable</button>
-<button id="destroy">Toggle widget</button>
-</p>
-
-<p>
-<button id="getvalue">Get value</button>
-<button id="setvalue">Set value to 5</button>
-</p>
-
-</div><!-- End demo -->
-
-<div class="demo-description">
-<p>
-Default spinner.
-</p>
-</div><!-- End demo-description -->
-
-</body>
-</html>
+<!DOCTYPE html> +<html lang="en"> +<head> + <meta charset="utf-8"> + <title>jQuery UI Spinner - Default functionality</title> + <link type="text/css" href="../../themes/base/jquery.ui.all.css" rel="stylesheet" /> + <script type="text/javascript" src="../../jquery-1.6.2.js"></script> + <script type="text/javascript" src="../../external/jquery.mousewheel-3.0.4.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.button.js"></script> + <script type="text/javascript" src="../../ui/jquery.ui.spinner.js"></script> + <link type="text/css" href="../demos.css" rel="stylesheet" /> + <script type="text/javascript"> + $(function() { + $("#spinner").spinner(); + + $("#disable").toggle(function() { + $("#spinner").spinner("disable"); + }, function() { + $("#spinner").spinner("enable"); + }); + $("#destroy").toggle(function() { + $("#spinner").spinner("destroy"); + }, function() { + $("#spinner").spinner(); + }); + $("#getvalue").click(function() { + alert($("#spinner").spinner("value")); + }); + $("#setvalue").click(function() { + $("#spinner").spinner("value", 5); + }); + + $("button").button(); + }); + </script> +</head> +<body> + +<div class="demo"> + +<p><label for="spinner">Select a value:</label> +<input id="spinner" name="value" /></p> + +<p> +<button id="disable">Toggle disable/enable</button> +<button id="destroy">Toggle widget</button> +</p> + +<p> +<button id="getvalue">Get value</button> +<button id="setvalue">Set value to 5</button> +</p> + +</div><!-- End demo --> + +<div class="demo-description"> +<p> +Default spinner. +</p> +</div><!-- End demo-description --> + +</body> +</html> diff --git a/demos/spinner/index.html b/demos/spinner/index.html index c1b9d9288..2bbb796f0 100644 --- a/demos/spinner/index.html +++ b/demos/spinner/index.html @@ -1,20 +1,20 @@ -<!DOCTYPE html>
-<html lang="en">
-<head>
- <title>jQuery UI Spinner 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="decimal.html">Decimal</a></li>
- <li><a href="currency.html">Currency</a></li>
- <li><a href="latlong.html">Map</a></li>
- <li><a href="time.html">Time</a></li>
- <li><a href="overflow.html">Overflow</a></li>
- </ul>
- </div>
-</body>
-</html>
+<!DOCTYPE html> +<html lang="en"> +<head> + <title>jQuery UI Spinner 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="decimal.html">Decimal</a></li> + <li><a href="currency.html">Currency</a></li> + <li><a href="latlong.html">Map</a></li> + <li><a href="time.html">Time</a></li> + <li><a href="overflow.html">Overflow</a></li> + </ul> + </div> +</body> +</html> diff --git a/demos/spinner/latlong.html b/demos/spinner/latlong.html index 3c549f180..954f83996 100644 --- a/demos/spinner/latlong.html +++ b/demos/spinner/latlong.html @@ -1,60 +1,60 @@ -<!DOCTYPE html>
-<html lang="en">
-<head>
- <meta charset="utf-8">
- <title>jQuery UI Spinner - Map</title>
- <link type="text/css" href="../../themes/base/jquery.ui.all.css" rel="stylesheet" />
- <script type="text/javascript" src="http://maps.google.com/maps/api/js?sensor=false"></script>
- <script type="text/javascript" src="../../jquery-1.6.2.js"></script>
- <script type="text/javascript" src="../../external/jquery.mousewheel-3.0.4.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.button.js"></script>
- <script type="text/javascript" src="../../ui/jquery.ui.spinner.js"></script>
- <link type="text/css" href="../demos.css" rel="stylesheet" />
- <script type="text/javascript">
- $(function() {
- function latlong() {
- return new google.maps.LatLng($("#lat").val(),$("#lng").val());
- }
- function position() {
- map.setCenter(latlong());
- }
- $("#lat, #lng").spinner({
- precision: 6,
- change: position
- });
-
- var map = new google.maps.Map($("#map")[0], {
- zoom: 8,
- center: latlong(),
- mapTypeId: google.maps.MapTypeId.ROADMAP
- });
- });
- </script>
- <style>
- #map { width:500px; height:500px; }
- </style>
-</head>
-<body>
-
-<div class="demo">
-
-<label for="lat">Latitude</label>
-<input id="lat" name="lat" value="44.797916" />
-<br/>
-<label for="lng">Longitude</label>
-<input id="lng" name="lng" value="-93.278046" />
-
-<div id="map"></div>
-
-</div><!-- End demo -->
-
-<div class="demo-description">
-<p>
-Google Maps integration, using spinners to change latidude and longitude.
-</p>
-</div><!-- End demo-description -->
-
-</body>
-</html>
+<!DOCTYPE html> +<html lang="en"> +<head> + <meta charset="utf-8"> + <title>jQuery UI Spinner - Map</title> + <link type="text/css" href="../../themes/base/jquery.ui.all.css" rel="stylesheet" /> + <script type="text/javascript" src="http://maps.google.com/maps/api/js?sensor=false"></script> + <script type="text/javascript" src="../../jquery-1.6.2.js"></script> + <script type="text/javascript" src="../../external/jquery.mousewheel-3.0.4.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.button.js"></script> + <script type="text/javascript" src="../../ui/jquery.ui.spinner.js"></script> + <link type="text/css" href="../demos.css" rel="stylesheet" /> + <script type="text/javascript"> + $(function() { + function latlong() { + return new google.maps.LatLng($("#lat").val(),$("#lng").val()); + } + function position() { + map.setCenter(latlong()); + } + $("#lat, #lng").spinner({ + precision: 6, + change: position + }); + + var map = new google.maps.Map($("#map")[0], { + zoom: 8, + center: latlong(), + mapTypeId: google.maps.MapTypeId.ROADMAP + }); + }); + </script> + <style> + #map { width:500px; height:500px; } + </style> +</head> +<body> + +<div class="demo"> + +<label for="lat">Latitude</label> +<input id="lat" name="lat" value="44.797916" /> +<br/> +<label for="lng">Longitude</label> +<input id="lng" name="lng" value="-93.278046" /> + +<div id="map"></div> + +</div><!-- End demo --> + +<div class="demo-description"> +<p> +Google Maps integration, using spinners to change latidude and longitude. +</p> +</div><!-- End demo-description --> + +</body> +</html> diff --git a/demos/spinner/overflow.html b/demos/spinner/overflow.html index 23ae1a888..45b8f9573 100644 --- a/demos/spinner/overflow.html +++ b/demos/spinner/overflow.html @@ -1,47 +1,47 @@ -<!DOCTYPE html>
-<html lang="en">
-<head>
- <meta charset="utf-8">
- <title>jQuery UI Spinner - Default functionality</title>
- <link type="text/css" href="../../themes/base/jquery.ui.all.css" rel="stylesheet" />
- <script type="text/javascript" src="../../jquery-1.6.2.js"></script>
- <script type="text/javascript" src="../../external/jquery.mousewheel-3.0.4.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.button.js"></script>
- <script type="text/javascript" src="../../ui/jquery.ui.spinner.js"></script>
- <link type="text/css" href="../demos.css" rel="stylesheet" />
- <script type="text/javascript">
- $(function() {
- $("#spinner").spinner({
- spin: function(event, ui) {
- if (ui.value > 10) {
- $(this).spinner("value", -10);
- return false;
- } else if (ui.value < -10) {
- $(this).spinner("value", 10);
- return false;
- }
- }
- });
- });
- </script>
-</head>
-<body>
-
-<div class="demo">
- <p>
- <label for="spinner">Select a value:</label>
- <input id="spinner" name="value" />
- </p>
-</div>
-
-<div class="demo-description">
- <p>
- Overflowing spinner restricted to a range of -10 to 10.
- For anything above 10, it'll overflow to -10, and the other way round.
- </p>
-</div>
-
-</body>
-</html>
+<!DOCTYPE html> +<html lang="en"> +<head> + <meta charset="utf-8"> + <title>jQuery UI Spinner - Default functionality</title> + <link type="text/css" href="../../themes/base/jquery.ui.all.css" rel="stylesheet" /> + <script type="text/javascript" src="../../jquery-1.6.2.js"></script> + <script type="text/javascript" src="../../external/jquery.mousewheel-3.0.4.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.button.js"></script> + <script type="text/javascript" src="../../ui/jquery.ui.spinner.js"></script> + <link type="text/css" href="../demos.css" rel="stylesheet" /> + <script type="text/javascript"> + $(function() { + $("#spinner").spinner({ + spin: function(event, ui) { + if (ui.value > 10) { + $(this).spinner("value", -10); + return false; + } else if (ui.value < -10) { + $(this).spinner("value", 10); + return false; + } + } + }); + }); + </script> +</head> +<body> + +<div class="demo"> + <p> + <label for="spinner">Select a value:</label> + <input id="spinner" name="value" /> + </p> +</div> + +<div class="demo-description"> + <p> + Overflowing spinner restricted to a range of -10 to 10. + For anything above 10, it'll overflow to -10, and the other way round. + </p> +</div> + +</body> +</html> diff --git a/demos/spinner/time.html b/demos/spinner/time.html index 5858a5071..3ae06da46 100644 --- a/demos/spinner/time.html +++ b/demos/spinner/time.html @@ -1,71 +1,71 @@ -<!DOCTYPE html>
-<html lang="en">
-<head>
- <meta charset="utf-8">
- <title>jQuery UI Spinner - decimal</title>
- <link type="text/css" href="../../themes/base/jquery.ui.all.css" rel="stylesheet" />
- <script type="text/javascript" src="../../jquery-1.6.2.js"></script>
- <script type="text/javascript" src="../../external/jquery.mousewheel-3.0.4.js"></script>
- <script type="text/javascript" src="../../external/jquery.global.js"></script>
- <script type="text/javascript" src="../../external/jquery.global.de-DE.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.button.js"></script>
- <script type="text/javascript" src="../../ui/jquery.ui.spinner.js"></script>
- <link type="text/css" href="../demos.css" rel="stylesheet" />
- <script type="text/javascript">
- $.widget("ui.timespinner", $.ui.spinner, {
- options: {
- // seconds
- step: 60 * 1000,
- // hours
- page: 60
- },
-
- _parse: function(value) {
- if (typeof value == 'string') {
- return +$.global.parseDate(value)
- }
- return value;
- },
- _format: function() {
- this.element.val( $.global.format(new Date(this.options.value), "t") );
- }
- })
- $(function() {
- $("#spinner").timespinner();
-
- $("#culture").change(function() {
- var current = $("#spinner").timespinner("value");
- $.global.preferCulture($(this).val());
- $("#spinner").timespinner("value", current);
- });
- });
- </script>
-</head>
-<body>
-
-<div class="demo">
-<p>
- <label for="spinner">Time spinner:</label>
- <input id="spinner" name="spinner" value="08:30 PM" />
-</p>
-<p>
- <label for="culture">Select a culture to use for formatting:</label>
- <select id="culture">
- <option value="en-EN" selected="selected">English</option>
- <option value="de-DE">German</option>
- </select>
-</p>
-</div>
-
-<div class="demo-description">
-<p>
- A custom widget extending spinner. Use the Globalization plugin to parse and output
- a timestamp, with custom step and page options. Cursor up/down spins minutes, page up/down
- spins hours.
-</p>
-</div>
-
-</body>
-</html>
+<!DOCTYPE html> +<html lang="en"> +<head> + <meta charset="utf-8"> + <title>jQuery UI Spinner - decimal</title> + <link type="text/css" href="../../themes/base/jquery.ui.all.css" rel="stylesheet" /> + <script type="text/javascript" src="../../jquery-1.6.2.js"></script> + <script type="text/javascript" src="../../external/jquery.mousewheel-3.0.4.js"></script> + <script type="text/javascript" src="../../external/jquery.global.js"></script> + <script type="text/javascript" src="../../external/jquery.global.de-DE.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.button.js"></script> + <script type="text/javascript" src="../../ui/jquery.ui.spinner.js"></script> + <link type="text/css" href="../demos.css" rel="stylesheet" /> + <script type="text/javascript"> + $.widget("ui.timespinner", $.ui.spinner, { + options: { + // seconds + step: 60 * 1000, + // hours + page: 60 + }, + + _parse: function(value) { + if (typeof value == 'string') { + return +$.global.parseDate(value) + } + return value; + }, + _format: function() { + this.element.val( $.global.format(new Date(this.options.value), "t") ); + } + }) + $(function() { + $("#spinner").timespinner(); + + $("#culture").change(function() { + var current = $("#spinner").timespinner("value"); + $.global.preferCulture($(this).val()); + $("#spinner").timespinner("value", current); + }); + }); + </script> +</head> +<body> + +<div class="demo"> +<p> + <label for="spinner">Time spinner:</label> + <input id="spinner" name="spinner" value="08:30 PM" /> +</p> +<p> + <label for="culture">Select a culture to use for formatting:</label> + <select id="culture"> + <option value="en-EN" selected="selected">English</option> + <option value="de-DE">German</option> + </select> +</p> +</div> + +<div class="demo-description"> +<p> + A custom widget extending spinner. Use the Globalization plugin to parse and output + a timestamp, with custom step and page options. Cursor up/down spins minutes, page up/down + spins hours. +</p> +</div> + +</body> +</html> |