Slide back to original spot : Slider « Dojo toolkit « JavaScript DHTML

Slide back to original spot

 

<html>
  <head>
    <link rel="StyleSheet" type="text/css"
      href="js/dojo/dijit/themes/tundra/tundra.css">
      
    <script type="text/javascript">
      var djConfig = {
        baseScriptUri : "js/dojo/",
        parseOnLoad : true
      };
    </script>
    <script type="text/javascript" src="js/dojo/dojo/dojo.js"></script>
    <script>
        dojo.require("dojo.fx");
        dojo.require("dojo.dnd.move");
        dojo.addOnLoad(function(  ){
          var move = new dojo.dnd.Moveable(dojo.byId("my"));
          var coords;
          dojo.subscribe("/dnd/move/start",function(e){
            coords = dojo.coords(e.node);
          });
          dojo.subscribe("/dnd/move/stop",function(e){
            dojo.fx.slideTo({
              node: e.node,
              top: coords.t,
              left: coords.l,
              duration:2000
            }).play(  );
          });
       });
    </script>
  </head>
  <body class="tundra">
       <p style="position : absolute; left : 300px; top : 300px;"
                  id="my"
               >Drag and drop me somewhere else</p>
</body>
</html>

Dojo-toolkit.zip( 3,849 k)

1.	Create vertical slider and set value, minimum, maximum and discreteValues
2.	Horizontal slider bar
3.	Simple slider
4.	Slide in animation
5.	Slider on change dojo event
6.	Slider on change event
7.	Max/min slider value
8.	Set intermediateChanges for Slider
9.	Set slide handle image
10.	Format slider value

Slide back to original spot : Slider « Dojo toolkit « JavaScript DHTML

Related examples in the same category