diff options
| author | Richard Worth <rdworth@gmail.com> | 2009-10-12 10:50:38 +0000 |
|---|---|---|
| committer | Richard Worth <rdworth@gmail.com> | 2009-10-12 10:50:38 +0000 |
| commit | b7bf4b4527d3e849b55274e38e62c0d893779a1a (patch) | |
| tree | 3cabfc5911476e30a32a615e1dde243003cb83c3 /tests/visual/slider | |
| parent | 299f20b29966ba5c4cd3570ccb9ca871f39242bb (diff) | |
| download | jquery-ui-b7bf4b4527d3e849b55274e38e62c0d893779a1a.tar.gz jquery-ui-b7bf4b4527d3e849b55274e38e62c0d893779a1a.zip | |
Slider: Fixed animation to respond to keypress as well as mouse click, animation still does not occur at init or during mouse drag slide, both by design. Animation now occurs, if animate is on, when using the value method, but not when using the value option. This allows for animated and non-animated programmatic setting of values without changing the animate option.
Fixes #4432 - Allow animation when programmatically changing slider value
Fixes #4659 - Allow slider to animate if slider value is set programatically
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> |