Guest User

jQuery Ui Testing

a guest
Oct 18th, 2013
51
0
Never
Not a member of Pastebin yet? Sign Up, it unlocks many cool features!
HTML 5 1.08 KB | None | 0 0
  1. <!doctype html>
  2.  
  3. <html lang="en">
  4. <head>
  5.   <meta charset="utf-8" />
  6.   <title>jQuery UI Slider - Range with fixed maximum</title>
  7.   <link rel="stylesheet" href="http://code.jquery.com/ui/1.10.3/themes/smoothness/jquery-ui.css" />
  8.   <script src="http://code.jquery.com/jquery-1.9.1.js"></script>
  9.   <script src="http://code.jquery.com/ui/1.10.3/jquery-ui.js"></script>
  10. <!--   <link rel="stylesheet" href="/resources/demos/style.css" /> -->
  11.   <script>
  12.   $(function() {
  13.     $( "#slider-savings" ).slider({
  14.       range: "max",
  15.       min: 10,
  16.       max: 1000,
  17.       value: 20,
  18.       step: 5,
  19.       slide: function( event, ui ) {
  20.         $( "#amount" ).val( ui.value );
  21.       }
  22.     });
  23.     $( "#amount" ).val( $( "#slider-savings" ).slider( "value" ) );
  24.   });
  25.   </script>
  26. </head>
  27. <body>
  28.  
  29. <p>
  30.   <label for="amount">Amount Saved Each Day: &pound;</label>
  31.   <input type="text" id="amount" style="border: 0; color: #f6931f; font-weight: bold;" />
  32. </p>
  33.  
  34.  
  35.  
  36. <div id="slider-savings"></div>
  37.  
  38. <p>
  39.   <label for="amount">Amount Saved Per Month: &pound;</label>
  40. </p>
  41.  
  42.  
  43. </body>
  44. </html>
Advertisement
Add Comment
Please, Sign In to add comment