diff options
Diffstat (limited to 'tests/visual/slider')
-rw-r--r-- | tests/visual/slider/slider_option_animate_true.html | 45 |
1 files changed, 42 insertions, 3 deletions
diff --git a/tests/visual/slider/slider_option_animate_true.html b/tests/visual/slider/slider_option_animate_true.html index 40bbb55b6..dba82c083 100644 --- a/tests/visual/slider/slider_option_animate_true.html +++ b/tests/visual/slider/slider_option_animate_true.html @@ -7,17 +7,56 @@ <script type="text/javascript" src="../../../jquery-1.3.2.js"></script> <script type="text/javascript" src="../../../ui/jquery.ui.core.js"></script> <script type="text/javascript" src="../../../ui/jquery.ui.slider.js"></script> + + <style type="text/css"> + fieldset { padding: 1em; margin: 1em; } + legend { font-size: 1.3em; font-family: monospace; font-weight: bold; } + #slider1 { margin: 1em; } + #slider2 { margin: 1em; height: 400px; } + </style> + <script type="text/javascript"> $(function() { - $("#slider").slider({ - animate: true + $("#slider1").slider({ + animate: true, + step: 10 + }); + $("#slider2").slider({ + animate: true, + orientation: 'vertical', + step: 5, + values: [5, 15, 35, 75] }); }); </script> </head> <body> -<div id="slider"></div> +<fieldset> + <legend>$("#slider1").slider({ + animate: true, + step: 10 + });</legend> +<div id="slider1"></div> +<button onclick="$('#slider1').slider('value', 15);">method value: 15</button> +<button onclick="$('#slider1').slider('value', 75);">method value: 75</button> +<button onclick="$('#slider1').slider('option', 'value', 25);">option value: 25</button> +<button onclick="$('#slider1').slider('option', 'value', 85);">option value: 85</button> +</fieldset> + +<fieldset> + <legend>$("#slider2").slider({ + animate: true, + orientation: 'vertical', + step: 5, + values: [5, 15, 35, 75] + });</legend> +<div id="slider2"></div> +<button onclick="$('#slider2').slider('values', [10, 20, 30, 40]);">method values: [10, 20, 30, 40]</button> +<button onclick="$('#slider2').slider('values', [80, 70, 60, 50]);">method values: [80, 70, 60, 50]</button> +<button onclick="$('#slider2').slider('option', 'values', [20, 30, 40, 50]);">option values: [20, 30, 40, 50]</button> +<button onclick="$('#slider2').slider('option', 'values', [90, 80, 70, 60]);">option values: [90, 80, 70, 60]</button> +</fieldset> </body> </html> |