Ticket #4432: slider_animate.html

File slider_animate.html, 1.3 KB (added by yourcelf, May 07, 2009 01:57PM UTC)

Visual test for slider animation

<!doctype html>
<html lang="en">
<head>
	<title>Slider Visual Test : Default</title>
	<link rel="stylesheet" href="../visual.css" type="text/css" />
	<link rel="stylesheet" href="../../../themes/base/ui.all.css" type="text/css">
	<script type="text/javascript" src="../../../jquery-1.3.2.js"></script>
	<script type="text/javascript" src="../../../ui/ui.core.js"></script>
	<script type="text/javascript" src="../../../ui/ui.slider.js"></script>
    <script type="text/javascript">//<![CDATA[
        $(document).ready(function() {
            $("#slider").slider({
                animate: true   
            });
        });
    //]]></script>
</head>
<body>

<div id='slider'></div>

<h2>Programatic changes</h2>
<p>No animation.  Slider should move immediately to position. 
    <a href='#' onclick='$("#slider").slider("value", 0);'>0</a>
    <a href='#' onclick='$("#slider").slider("value", 50, false);'>50</a>
    <a href='#' onclick='$("#slider").slider("value", 100);'>100</a>
</p>
<p>Animation.  Slider should move with animated slide.
    <a href='#' onclick='$("#slider").slider("value", 0, true);'>0</a>
    <a href='#' onclick='$("#slider").slider("value", 50, true);'>50</a>
    <a href='#' onclick='$("#slider").slider("value", 100, true);'>100</a>
</p>

</body>
</html>

Download in other formats:

Original Format