aboutsummaryrefslogtreecommitdiffstats
path: root/demos
diff options
context:
space:
mode:
authorMaggie Costello Wachs <fg.maggie@gmail.com>2009-01-19 22:42:58 +0000
committerMaggie Costello Wachs <fg.maggie@gmail.com>2009-01-19 22:42:58 +0000
commitf2fb805e1832dd579bac7fa7171192028e6b0c32 (patch)
tree9518c99d5643c714f0fb1054b67bdda98ab465c2 /demos
parent986505846ed27d34962353a967d1689cbdda4969 (diff)
downloadjquery-ui-f2fb805e1832dd579bac7fa7171192028e6b0c32.tar.gz
jquery-ui-f2fb805e1832dd579bac7fa7171192028e6b0c32.zip
updated the demo captions, and reordered the examples navigation
Diffstat (limited to 'demos')
-rw-r--r--demos/datepicker/alt_field.html6
-rw-r--r--demos/datepicker/buttonbar.html4
-rw-r--r--demos/datepicker/date_formats.html4
-rw-r--r--demos/datepicker/default.html4
-rw-r--r--demos/datepicker/dropdown_month_year.html4
-rw-r--r--demos/datepicker/icon_trigger.html6
-rw-r--r--demos/datepicker/index.html18
-rw-r--r--demos/datepicker/inline.html7
-rw-r--r--demos/datepicker/localization.html5
-rw-r--r--demos/datepicker/min_max.html7
-rw-r--r--demos/datepicker/multiple_calendars.html18
11 files changed, 29 insertions, 54 deletions
diff --git a/demos/datepicker/alt_field.html b/demos/datepicker/alt_field.html
index fba6a3273..fb543b3f6 100644
--- a/demos/datepicker/alt_field.html
+++ b/demos/datepicker/alt_field.html
@@ -1,7 +1,7 @@
<!doctype html>
<html lang="en">
<head>
- <title>jQuery UI Datepicker - Alternate Field</title>
+ <title>jQuery UI Datepicker - Populate alternate field</title>
<link type="text/css" href="../../themes/base/ui.all.css" rel="stylesheet" />
<script type="text/javascript" src="../../jquery-1.3.js"></script>
<script type="text/javascript" src="../../ui/ui.core.js"></script>
@@ -23,9 +23,7 @@
<div class="demo-description">
-<p>The datepicker can populate an alternate field, with its own format, whenever a date is selected.
- This feature might be used to present a human-friendly date for user selection,
- while passing a more computer-friendly date through for further processing.</p>
+<p>Populate an alternate field with its own date format whenever a date is selected using the <strong>altField</strong> and <strong>altFormat</strong> options. This feature could be used to present a human-friendly date for user selection, while passing a more computer-friendly date through for further processing.</p>
</div><!-- End demo-description -->
diff --git a/demos/datepicker/buttonbar.html b/demos/datepicker/buttonbar.html
index c36ca835f..5d914e943 100644
--- a/demos/datepicker/buttonbar.html
+++ b/demos/datepicker/buttonbar.html
@@ -1,7 +1,7 @@
<!doctype html>
<html lang="en">
<head>
- <title>jQuery UI Datepicker - Button bar Demo</title>
+ <title>jQuery UI Datepicker - Display button bar</title>
<link type="text/css" href="../../themes/base/ui.all.css" rel="stylesheet" />
<script type="text/javascript" src="../../jquery-1.3.js"></script>
<script type="text/javascript" src="../../ui/ui.core.js"></script>
@@ -25,7 +25,7 @@
<div class="demo-description">
-<p>This example adds a bar at the bottom of the calendar with buttons for selecting Today's date and a Done button for closing the calendar. The individual buttons are on by default if the bar is added but each can be turned off via options. The button text is customizable.</p>
+<p>Display a button for selecting Today's date and a Done button for closing the calendar with the boolean <strong>showButtonPanel</strong> option. Each button is enabled by default when the bar is displayed, but can be turned off with additional options. Button text is customizable.</p>
</div><!-- End demo-description -->
diff --git a/demos/datepicker/date_formats.html b/demos/datepicker/date_formats.html
index 6027c5ffb..b1a7384d0 100644
--- a/demos/datepicker/date_formats.html
+++ b/demos/datepicker/date_formats.html
@@ -1,7 +1,7 @@
<!doctype html>
<html lang="en">
<head>
- <title>jQuery UI Datepicker - Date Formats</title>
+ <title>jQuery UI Datepicker - Format date</title>
<link type="text/css" href="../../themes/base/ui.all.css" rel="stylesheet" />
<script type="text/javascript" src="../../jquery-1.3.js"></script>
<script type="text/javascript" src="../../ui/ui.core.js"></script>
@@ -35,7 +35,7 @@
<div class="demo-description">
-<p>The datepicker may present the selected date in a variety of formats.</p>
+<p>Display date feedback in a variety of ways. Choose a date format from the dropdown, then click on the input and select a date to see it in that format.</p>
</div><!-- End demo-description -->
diff --git a/demos/datepicker/default.html b/demos/datepicker/default.html
index a9d915d4b..8872c7eb8 100644
--- a/demos/datepicker/default.html
+++ b/demos/datepicker/default.html
@@ -1,7 +1,7 @@
<!doctype html>
<html lang="en">
<head>
- <title>jQuery UI Datepicker - Default Demo</title>
+ <title>jQuery UI Datepicker - Default functionality</title>
<link type="text/css" href="../../themes/base/ui.all.css" rel="stylesheet" />
<script type="text/javascript" src="../../jquery-1.3.js"></script>
<script type="text/javascript" src="../../ui/ui.core.js"></script>
@@ -23,7 +23,7 @@
<div class="demo-description">
-<p>This is a default datepicker which is tied to a standard form input. The calendar opens in a small overlay onFocus and closes automatically onBlur if a date if selected.</p>
+<p>The datepicker is tied to a standard form input field. Focus on the input (click, or use the tab key) to open an interactive calendar in a small overlay. Choose a date, click elsewhere on the page (blur the input), or hit the Esc key to close. If a date is chosen, feedback is shown as the input's value.</p>
</div><!-- End demo-description -->
diff --git a/demos/datepicker/dropdown_month_year.html b/demos/datepicker/dropdown_month_year.html
index fe685f620..9ccd42e2b 100644
--- a/demos/datepicker/dropdown_month_year.html
+++ b/demos/datepicker/dropdown_month_year.html
@@ -1,7 +1,7 @@
<!doctype html>
<html lang="en">
<head>
- <title>jQuery UI Datepicker - Month &amp; Year Menus Demo</title>
+ <title>jQuery UI Datepicker - Display month &amp; year menus</title>
<link type="text/css" href="../../themes/base/ui.all.css" rel="stylesheet" />
<script type="text/javascript" src="../../jquery-1.3.js"></script>
<script type="text/javascript" src="../../ui/ui.core.js"></script>
@@ -26,7 +26,7 @@
<div class="demo-description">
-<p>This datepicker has an optional month and year dropdown added to make it easier to navigate through large timeframes. This is done by adding the changeMonth:true and changeYear:true options.</p>
+<p>Show month and year dropdowns in place of the static month/year header to facilitate navigation through large timeframes. Add the boolean <strong>changeMonth</strong> and <strong>changeYear</strong> options.</p>
</div><!-- End demo-description -->
diff --git a/demos/datepicker/icon_trigger.html b/demos/datepicker/icon_trigger.html
index b421a54d5..4aa7a57b2 100644
--- a/demos/datepicker/icon_trigger.html
+++ b/demos/datepicker/icon_trigger.html
@@ -1,7 +1,7 @@
<!doctype html>
<html lang="en">
<head>
- <title>jQuery UI Datepicker - Icon Trigger</title>
+ <title>jQuery UI Datepicker - Icon trigger</title>
<link type="text/css" href="../../themes/base/ui.all.css" rel="stylesheet" />
<script type="text/javascript" src="../../jquery-1.3.js"></script>
<script type="text/javascript" src="../../ui/ui.core.js"></script>
@@ -23,9 +23,7 @@
<div class="demo-description">
-<p>This datepicker is triggered by clicking on the icon following the field,
- instead of the field gaining focus. You can also set the datepicker to
- open in both cases.</p>
+<p>Click the icon next to the input field to show the datepicker. Set the datepicker to open on focus (default behavior), on icon click, or both.</p>
</div><!-- End demo-description -->
diff --git a/demos/datepicker/index.html b/demos/datepicker/index.html
index cdb8d467e..a1738de2e 100644
--- a/demos/datepicker/index.html
+++ b/demos/datepicker/index.html
@@ -9,16 +9,16 @@
<div class="demos-nav">
<h4>Examples</h4>
<ul>
- <li class="demo-config-on"><a href="default.html">Default datepicker</a></li>
+ <li class="demo-config-on"><a href="default.html">Default functionality</a></li>
+ <li><a href="date_formats.html">Format date</a></li>
+ <li><a href="min_max.html">Restrict date range</a></li>
+ <li><a href="localization.html">Localize calendar</a></li>
+ <li><a href="alt_field.html">Populate alternate field</a></li>
+ <li><a href="inline.html">Display inline</a></li>
+ <li><a href="buttonbar.html">Display button bar</a></li>
+ <li><a href="dropdown_month_year.html">Display month &amp; year menus</a></li>
+ <li><a href="multiple_calendars.html">Display multiple months</a></li>
<li><a href="icon_trigger.html">Icon trigger</a></li>
- <li><a href="dropdown_month_year.html">Month &amp; year menus</a></li>
- <li><a href="buttonbar.html">Button bar</a></li>
- <li><a href="multiple_calendars.html">3 month view</a></li>
- <li><a href="inline.html">Inline</a></li>
- <li><a href="date_formats.html">Date formats</a></li>
- <li><a href="min_max.html">Minimum and maximum</a></li>
- <li><a href="alt_field.html">Alternate field</a></li>
- <li><a href="localization.html">Localization</a></li>
</ul>
</div>
diff --git a/demos/datepicker/inline.html b/demos/datepicker/inline.html
index d5170916e..f71525124 100644
--- a/demos/datepicker/inline.html
+++ b/demos/datepicker/inline.html
@@ -1,7 +1,7 @@
<!doctype html>
<html lang="en">
<head>
- <title>jQuery UI Datepicker - Inline Demo</title>
+ <title>jQuery UI Datepicker - Display inline</title>
<link type="text/css" href="../../themes/base/ui.all.css" rel="stylesheet" />
<script type="text/javascript" src="../../jquery-1.3.js"></script>
<script type="text/javascript" src="../../ui/ui.core.js"></script>
@@ -23,10 +23,7 @@ Date: <div id="datepicker" /></div>
<div class="demo-description">
-<p>
-This is an example of an inline date picker that is embedded in the page instead of opening in an overlay.
-This is done by calling .datepicker() on a div instead of an input.
-</p>
+<p>Display the datepicker embedded in the page instead of in an overlay. Simply call .datepicker() on a div instead of an input.</p>
</div><!-- End demo-description -->
diff --git a/demos/datepicker/localization.html b/demos/datepicker/localization.html
index de7f82b19..285b7ee7f 100644
--- a/demos/datepicker/localization.html
+++ b/demos/datepicker/localization.html
@@ -1,7 +1,7 @@
<!doctype html>
<html lang="en">
<head>
- <title>jQuery UI Datepicker - Localization</title>
+ <title>jQuery UI Datepicker - Localize calendar</title>
<link type="text/css" href="../../themes/base/ui.all.css" rel="stylesheet" />
<script type="text/javascript" src="../../jquery-1.3.js"></script>
<script type="text/javascript" src="../../ui/ui.core.js"></script>
@@ -108,8 +108,7 @@
<div class="demo-description">
-<p>The datepicker may be localized for other languages and date preferences.
- There is built-in support for languages that read right-to-left, such as Arabic and Hebrew.</p>
+<p>Localize the datepicker calendar language and format (English / Western formatting is the default). The datepicker includes built-in support for languages that read right-to-left, such as Arabic and Hebrew.</p>
</div><!-- End demo-description -->
diff --git a/demos/datepicker/min_max.html b/demos/datepicker/min_max.html
index c8c598994..26673aae5 100644
--- a/demos/datepicker/min_max.html
+++ b/demos/datepicker/min_max.html
@@ -1,7 +1,7 @@
<!doctype html>
<html lang="en">
<head>
- <title>jQuery UI Datepicker - Minimum and Maximum</title>
+ <title>jQuery UI Datepicker - Restrict date range</title>
<link type="text/css" href="../../themes/base/ui.all.css" rel="stylesheet" />
<script type="text/javascript" src="../../jquery-1.3.js"></script>
<script type="text/javascript" src="../../ui/ui.core.js"></script>
@@ -23,10 +23,7 @@
<div class="demo-description">
-<p>The datepicker may have a minimum and/or maximum date set to restrict the range of possible dates.
- These dates may be set as actual dates (new Date(2009, 1 - 1, 26)), as a numeric offset from
- today (-20), or as a string of periods and units ('+1M +10D'). For the last, use 'D' for days,
- 'W' for weeks, 'M' for months, or 'Y' for years.</p>
+<p>Restrict the range of selectable dates with the <strong>minDate</strong> and <strong>maxDate</strong> options. Set the beginning and end dates as actual dates (new Date(2009, 1 - 1, 26)), as a numeric offset from today (-20), or as a string of periods and units ('+1M +10D'). For the last, use 'D' for days, 'W' for weeks, 'M' for months, or 'Y' for years.</p>
</div><!-- End demo-description -->
diff --git a/demos/datepicker/multiple_calendars.html b/demos/datepicker/multiple_calendars.html
index 1e21c5192..9ce129161 100644
--- a/demos/datepicker/multiple_calendars.html
+++ b/demos/datepicker/multiple_calendars.html
@@ -1,7 +1,7 @@
<!doctype html>
<html lang="en">
<head>
- <title>jQuery UI Datepicker - Multiple Calendars Demo</title>
+ <title>jQuery UI Datepicker - Display multiple months</title>
<link type="text/css" href="../../themes/base/ui.all.css" rel="stylesheet" />
<script type="text/javascript" src="../../jquery-1.3.js"></script>
<script type="text/javascript" src="../../ui/ui.core.js"></script>
@@ -26,21 +26,7 @@
<div class="demo-description">
-<p>
-This datepicker shows three months at a time by setting the <code>numberOfMonths</code> option to 3.
-This can be set to any number that will fit within your layout.
-The multiple calendars are used to make it easier to visually scan across months and make a selection.
-</p>
-
-<div style="padding: 0pt 0.7em; margin-top: 20px;" class="ui-state-highlight ui-corner-all">
-<p>
-<span style="float: left; margin-right: 0.3em;" class="ui-icon ui-icon-info"></span>
-<strong>Note:</strong>
-This is not a date range picker.
-In a future release, a custom date range plugin will be added.
-For users that want to use the old date range picker built into the datepicker, they must use the previous version of this plugin (v1.5.3).
-</p>
-</div>
+<p>Set the <strong>numberOfMonths</strong> option to an integer of 2 or more to show multiple months in a single datepicker.</p>
</div><!-- End demo-description -->