<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="http://www.w3.org/1999/xhtml"> <head> <meta http-equiv="Content-Type" content="text/html; charset=UTF-8"/> <title>jSlider Zero value test</title> <!-- bin/jquery.slider.min.css --> <link rel="stylesheet" href="../css/jslider.css" type="text/css"> <link rel="stylesheet" href="../css/jslider.plastic.css" type="text/css"> <!-- end --> <script type="text/javascript" src="../js/jquery-1.7.1.js"></script> <!-- bin/jquery.slider.min.js --> <script type="text/javascript" src="../js/jshashtable-2.1_src.js"></script> <script type="text/javascript" src="../js/jquery.numberformatter-1.2.3.js"></script> <script type="text/javascript" src="../js/tmpl.js"></script> <script type="text/javascript" src="../js/jquery.dependClass-0.1.js"></script> <script type="text/javascript" src="../js/draggable-0.1.js"></script> <script type="text/javascript" src="../js/jquery.slider.js"></script> <!-- end --> <style type="text/css" media="screen"> body { background: #EEF0F7; } .layout { padding: 50px; font-family: Georgia, serif; } .layout-slider { margin-bottom: 60px; width: 50%; } </style> </head> <body> <div class="layout"> <div class="layout-slider" style="width: 100%"> Slider <span style="display: inline-block; width: 400px; padding: 0 5px;"><input id="Slider1" type="slider" name="price" value="50" /></span> in string </div> <script type="text/javascript" charset="utf-8"> jQuery("#Slider1").slider({ from: -50, to: 200, step: 5, dimension: '%', skin: 'plastic', scale: ['-50', '|', '0', '|', '50', '|', '100', '|', '150', '|', '200'] }); </script> <div class="layout-slider" style="width: 100%"> Slider <span style="display: inline-block; width: 400px; padding: 0 5px;"><input id="Slider2" type="slider" name="price" value="-0.5;0.5" /></span> in string </div> <script type="text/javascript" charset="utf-8"> jQuery("#Slider2").slider({ from: -1, to: 1, step: 0.1, round: 1, dimension: 'px', skin: 'plastic' }); </script> </div> </body> </html>