aboutsummaryrefslogtreecommitdiffstats
path: root/tests/visual/slider
diff options
context:
space:
mode:
Diffstat (limited to 'tests/visual/slider')
-rw-r--r--tests/visual/slider/slider_option_animate_true.html45
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>