Jquery slider c'est de la bonne !!!

Submitted by Sir Squall on Mon, 11/23/2009 - 18:58

Ah la la je vous jure, Jquery slider() c'est vraiment exeptionnel, on faire un petit cursor slider, en quelque seconde !

Tous est là tous dabord le script js:

<script type="text/javascript">
<!--//--><![CDATA[//><!--
 $(document).ready(function(){
             $("#field_price").slider({
                min : 0,
                max : 59000,
                values: [1,59000],
                slide: function(event, ui) { 
                   var value = ui.values;     
                   $("#field_price_info").html("CHF "+value[0]+"-"+value[1]);
                 },
                change: function(event, ui) { 
                   if(typeof json == 'undefined'){
                      var json = new Object();
                   }
                   json.field_price = ui.values;
                  var encoded = JSON.stringify(json);
                   Drupal_json_form.fields = encoded;
                  search_engine_ajax_load();
                 },
              }); 
            });
 
//--><!]]>
</script>

et suivi du code html:

<div id="field_price_info">CHF 0-59000</div>
<div id="field_price"></div>

et pour que sa fonctionne il vous faut ajouter une class css:

<link type="text/css" href="http://jqueryui.com/latest/themes/base/ui.all.css" rel="stylesheet" />

et ajouter les dernièrs fichiers jquery, dans l'orde d'abord le core, puis le slider, et biensur ne pas oublié de mettre a jour le jquery.js il faut la version 1.3.2 il sont disponible ci dessous

  <script type="text/javascript" src="http://jqueryui.com/latest/jquery-1.3.2.js"></script>
  <script type="text/javascript" src="http://jqueryui.com/latest/ui/ui.core.js"></script>
  <script type="text/javascript" src="http://jqueryui.com/latest/ui/ui.slider.js"></script>