diff options
| author | Felix Nagel <info@felixnagel.com> | 2011-06-16 23:51:55 +0200 |
|---|---|---|
| committer | Felix Nagel <info@felixnagel.com> | 2011-06-16 23:51:55 +0200 |
| commit | 519b26453a320d2e9f6d968956ef5e561c0c4f41 (patch) | |
| tree | 76a77d22d29e04fe9c4805d6483f6346d5e6c4f3 | |
| parent | b2d02482fa950cb51524312e4b2ec43a6eacee46 (diff) | |
| download | jquery-ui-519b26453a320d2e9f6d968956ef5e561c0c4f41.tar.gz jquery-ui-519b26453a320d2e9f6d968956ef5e561c0c4f41.zip | |
added: demo files refresh, overlay and typeahead
| -rw-r--r-- | demos/selectmenu/overlay.html | 86 | ||||
| -rw-r--r-- | demos/selectmenu/refresh.html | 70 | ||||
| -rw-r--r-- | demos/selectmenu/typeahead.html | 102 |
3 files changed, 258 insertions, 0 deletions
diff --git a/demos/selectmenu/overlay.html b/demos/selectmenu/overlay.html new file mode 100644 index 000000000..62dd748a0 --- /dev/null +++ b/demos/selectmenu/overlay.html @@ -0,0 +1,86 @@ +<html xmlns="http://www.w3.org/1999/xhtml">
+ <head>
+ <meta name="viewport" content="width=device-width; initial-scale=1.0; maximum-scale=1.0; user-scalable=0;" />
+ <meta name="apple-mobile-web-app-capable" content="yes" />
+ <title>OpenLayers Google Layer Example</title>
+ <link rel="stylesheet" href="http://openlayers.org/dev/examples/../theme/default/style.css" type="text/css" />
+ <link rel="stylesheet" href="http://openlayers.org/dev/examples/../theme/default/google.css" type="text/css" />
+ <link rel="stylesheet" href="http://openlayers.org/dev/examples/style.css" type="text/css" />
+ <!-- this gmaps key generated for http://openlayers.org/dev/ -->
+
+ <link type="text/css" href="../../themes/base/jquery.ui.all.css" rel="stylesheet" />
+ <link type="text/css" href="../../themes/base/jquery.ui.selectmenu.css" rel="stylesheet" />
+ <script type="text/javascript" src="../../jquery-1.5.1.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.selectmenu.js"></script>
+
+
+ <script src='http://maps.google.com/maps?file=api'></script>
+ <script src="http://openlayers.org/dev/examples/../OpenLayers.js"></script>
+ <script type="text/javascript">
+ var map;
+
+ function init() {
+ map = new OpenLayers.Map('map');
+ map.addControl(new OpenLayers.Control.LayerSwitcher());
+
+ var gphy = new OpenLayers.Layer.Google(
+ "Google Physical",
+ {type: G_PHYSICAL_MAP}
+ );
+ var gmap = new OpenLayers.Layer.Google(
+ "Google Streets", // the default
+ {numZoomLevels: 20}
+ );
+ var ghyb = new OpenLayers.Layer.Google(
+ "Google Hybrid",
+ {type: G_HYBRID_MAP, numZoomLevels: 20}
+ );
+ var gsat = new OpenLayers.Layer.Google(
+ "Google Satellite",
+ {type: G_SATELLITE_MAP, numZoomLevels: 22}
+ );
+
+
+ map.addLayers([gphy, gmap, ghyb, gsat]);
+
+ map.setCenter(new OpenLayers.LonLat(10.2, 48.9), 5);
+
+ $("#Selector").selectmenu({style: 'popup',width: 300,menuWidth:300,maxHeight:240});
+ }
+ </script>
+ </head>
+ <body onload="init()">
+ <h1 id="title">Google Layer Example</h1>
+
+ <div id="tags">
+ Google
+ </div>
+
+ <p id="shortdesc">
+ Demonstrate use of the various types of Google layers.
+ </p>
+ <select class="selectClass" id="Selector" >
+ <option value="-1">Select one</option>
+<option value="236">a</option>
+<option value="257">b</option>
+<option value="237">c</option>
+<option value="251">d</option>
+<option value="263">e</option>
+<option value="248">f</option>
+<option value="262">g</option>
+<option value="260">h</option>
+<option value="234">i</option>
+<option value="229">j</option>
+<option value="230">k</option>
+<option value="240">m</option>
+<option value="79">n</option>
+
+</select>
+ <div id="map" class="smallmap"></div>
+
+ </body>
+</html>
\ No newline at end of file diff --git a/demos/selectmenu/refresh.html b/demos/selectmenu/refresh.html new file mode 100644 index 000000000..0881995db --- /dev/null +++ b/demos/selectmenu/refresh.html @@ -0,0 +1,70 @@ +<!DOCTYPE html> +<html> + <head> + <meta http-equiv="content-type" content="text/html; charset=utf-8" /> + <title>Demo Page for jQuery UI selectmenu</title> + + <link type="text/css" href="../../themes/base/jquery.ui.all.css" rel="stylesheet" /> + <link type="text/css" href="../../themes/base/jquery.ui.selectmenu.css" rel="stylesheet" /> + <script type="text/javascript" src="../../jquery-1.5.1.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.selectmenu.js"></script> + + <style type="text/css"> + /* demo styles */ + body {font-size: 62.5%; font-family:"Verdana",sans-serif; } + fieldset { border:0; } + label,select,.ui-select-menu { float: left; margin-right: 10px; } + select { width: 200px; } + input#btn { cursor: pointer; } + textarea { + width: 500px; + height: 200px; + } + </style> + <script type="text/javascript"> + $(function() { + $('select#speedA').selectmenu(); + + $('#btn').click(function() { + $('select#speedA').html($("#add").val()); + $('select#speedA').selectmenu(); + }); + }); + </script> +</head> +<body><form action="#"> + <br /><br /><br /> + <fieldset> + <label for="speedA">Select a Speed:</label> + <select name="speedA" id="speedA"> + <option value="1">Item 1</option> + <option value="2">Item 2</option> + <option value="3">Item 3</option> + <option value="4">Item 4</option> + <option value="5">Item 5</option> + <option value="6">Item 6</option> + <option value="7">Item 7</option> + <option value="8">Item 8</option> + <option value="9">Item 9</option> + <option value="10">Item 10</option> + <option value="11">Item 11</option> + <option value="12">Item 12</option> + <option value="13">Item 13</option> + <option value="14">Item 14</option> + </select> + </fieldset> + <br /><br /><br /> + <textarea id="add"> +<option value="1">New Item 1</option> +<option value="2">New Item 2</option> +<option value="3">New Item 3</option> + </textarea> + <br /> + <input type="button" class="ui-state-default ui-widget-content" id="btn" value="Refresh Selectmenu" /> +</form> +</body> +</html>
\ No newline at end of file diff --git a/demos/selectmenu/typeahead.html b/demos/selectmenu/typeahead.html new file mode 100644 index 000000000..04dc3fe52 --- /dev/null +++ b/demos/selectmenu/typeahead.html @@ -0,0 +1,102 @@ +<!DOCTYPE html> +<html> + <head> + <meta http-equiv="content-type" content="text/html; charset=utf-8" /> + <title>Demo Page for jQuery UI selectmenu</title> + + <link type="text/css" href="../../themes/base/jquery.ui.all.css" rel="stylesheet" /> + <link type="text/css" href="../../themes/base/jquery.ui.selectmenu.css" rel="stylesheet" /> + <script type="text/javascript" src="../../jquery-1.5.1.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.selectmenu.js"></script> + + <style type="text/css"> + /* demo styles */ + body {font-size: 62.5%; font-family:"Verdana",sans-serif; } + fieldset { border:0; } + label,select,.ui-select-menu { float: left; margin-right: 10px; } + select { width: 200px; } + .wrap span.ui-selectmenu-item-header, + .wrap ul.ui-selectmenu-menu li a { text-decoration: underline !important; } + </style> + <script type="text/javascript"> + $(function(){ + $('select').selectmenu(); + }); + </script> +</head> +<body> + <br /> + <br /> + <form action="#"> + <fieldset> + <label for="state">Select a Speed:</label> + <select id="state"> + <option></option> + <option value="AL">Alabama</option> + <option value="AK">Alaska</option> + <option value="AS">American Samoa</option> + <option value="AZ">Arizona</option> + <option value="AR">Arkansas</option> + <option value="CA">California</option> + <option value="CO">Colorado</option> + <option value="CT">Connecticut</option> + <option value="DE">Delaware</option> + <option value="DC">District of Columbia</option> + <option value="FM">Federated States of Micronesia</option> + <option value="FL">Florida</option> + <option value="GA">Georgia</option> + <option value="GU">Guam</option> + <option value="HI">Hawaii</option> + <option value="ID">Idaho</option> + <option value="IL">Illinois</option> + <option value="IN">Indiana</option> + <option value="IA">Iowa</option> + <option value="KS">Kansas</option> + <option value="KY">Kentucky</option> + <option value="LA">Louisiana</option> + <option value="ME">Maine</option> + <option value="MH">Marshall Islands</option> + <option value="MD">Maryland</option> + <option value="MA">Massachusetts</option> + <option value="MI">Michigan</option> + <option value="MN">Minnesota</option> + <option value="MS">Mississippi</option> + <option value="MO">Missouri</option> + <option value="MT">Montana</option> + <option value="NE">Nebraska</option> + <option value="NV">Nevada</option> + <option value="NH">New Hampshire</option> + <option value="NJ">New Jersey</option> + <option value="NM">New Mexico</option> + <option value="NY">New York</option> + <option value="NC">North Carolina</option> + <option value="ND">North Dakota</option> + <option value="MP">Northern Mariana Islands</option> + <option value="OH">Ohio</option> + <option value="OK">Oklahoma</option> + <option value="OR">Oregon</option> + <option value="PW">Palau</option> + <option value="PA">Pennsylvania</option> + <option value="PR">Puerto Rico</option> + <option value="RI">Rhode Island</option> + <option value="SC">South Carolina</option> + <option value="SD">South Dakota</option> + <option value="TN">Tennessee</option> + <option value="TX">Texas</option> + <option value="UT">Utah</option> + <option value="VT">Vermont</option> + <option value="VI">Virgin Islands</option> + <option value="VA">Virginia</option> + <option value="WA">Washington</option> + <option value="WV">West Virginia</option> + <option value="WI">Wisconsin</option> + <option value="WY">Wyoming</option> + </select> + </fieldset> + </form> +</body> +</html>
\ No newline at end of file |