<link rel="stylesheet" href="../demos.css">
<script>
$(function() {
- $('#speed').selectmenu();
+ $( "#speed" ).selectmenu();
- $('#files').selectmenu();
+ $( "#files" ).selectmenu();
- $('#number').selectmenu().selectmenu("menuWidget").addClass("overflow");
+ $( "#number" )
+ .selectmenu()
+ .selectmenu( "menuWidget" )
+ .addClass( "overflow" );
});
</script>
<style>
- form { margin: 50px 0 0 0 }
- fieldset { border: 0; }
- label { display: block; }
- select { width: 200px; }
- .overflow { height: 200px; }
+ fieldset {
+ border: 0;
+ }
+ label {
+ display: block;
+ margin: 30px 0 0 0;
+ }
+ select {
+ width: 200px;
+ }
+ .overflow {
+ height: 200px;
+ }
</style>
</head>
<body>
<div class="demo">
<form action="#">
+
<fieldset>
<label for="speed">Select a speed</label>
<select name="speed" id="speed">
<option value="Fast">Fast</option>
<option value="Faster">Faster</option>
</select>
- <br />
- <br />
- <br />
+
<label for="files">Select a file</label>
<select name="files" id="files">
<optgroup label="Scripts">
<option value="someotherfile">Some other file</option>
</optgroup>
</select>
- <br />
- <br />
- <br />
+
<label for="number">Select a number</label>
<select name="number" id="number">
<option value="1">1</option>
<option value="19">19</option>
</select>
</fieldset>
+
</form>
-</div><!-- End demo -->
-
-
+</div>
<div class="demo-description">
<p>The Selectmenu widgets provides a styleable select element replacement. It will act as a proxy back to the original select element, controlling its state for form submission or serialization </p>
<p>The datasource is a native select element. Supports optgroups.</p>
-</div><!-- End demo-description -->
-
+</div>
</body>
</html>
projects / jquery-ui.git / commitdiff