third-party/jquery-ui-1.10.2/demos/spinner/overflow.html

   1 <!doctype html>
   2 <html lang="en">
   3 <head>
   4         <meta charset="utf-8">
   5         <title>jQuery UI Spinner - Overflow</title>
   6         <link rel="stylesheet" href="../../themes/base/jquery.ui.all.css">
   7         <script src="../../jquery-1.9.1.js"></script>
   8         <script src="../../external/jquery.mousewheel.js"></script>
   9         <script src="../../ui/jquery.ui.core.js"></script>
  10         <script src="../../ui/jquery.ui.widget.js"></script>
  11         <script src="../../ui/jquery.ui.button.js"></script>
  12         <script src="../../ui/jquery.ui.spinner.js"></script>
  13         <link rel="stylesheet" href="../demos.css">
  14         <script>
  15         $(function() {
  16                 $( "#spinner" ).spinner({
  17                         spin: function( event, ui ) {
  18                                 if ( ui.value > 10 ) {
  19                                         $( this ).spinner( "value", -10 );
  20                                         return false;
  21                                 } else if ( ui.value < -10 ) {
  22                                         $( this ).spinner( "value", 10 );
  23                                         return false;
  24                                 }
  25                         }
  26                 });
  27         });
  28         </script>
  29 </head>
  30 <body>
  31
  32 <p>
  33         <label for="spinner">Select a value:</label>
  34         <input id="spinner" name="value" />
  35 </p>
  36
  37 <div class="demo-description">
  38 <p>
  39 Overflowing spinner restricted to a range of -10 to 10.
  40 For anything above 10, it'll overflow to -10, and the other way round.
  41 </p>
  42 </div>
  43 </body>
  44 </html>