Dran n Drop all'interno di un div

[StelK]

Salve a tutti sono nuovo su questo forum e volevo porvi una domanda:
Sto usando le librerie di scriptaculous per il drag n drop e volevo sapere se c'era un metodo per fare in modo che il div che io sto trascinando non esca e non possa essere trascinato fuori dal div in cui e' contenuto...
esempio:

<div id="container">

<div id="draggable">
Trascinami
</div>

</div>
<script language="javascript">
new Draggable('draggable');
</script>

Quando il div 'draggable' viene trascinato non deve uscire da 'container'..
Grazie per le risposte,
Ciao a tutti

[Dennis]

Ciao,
purtroppo non conosco il funzionamento della libreria che stai utilizzando. Controlla a vedere se magari c'è un implementazione per quello che vuoi fare tu... cmq l'idea che mi viene cosi su due piedi è la seguente:

Nella funzione che esegue il trascinamento dovresti mettere un controllo sulle coordinate del DIV. Conoscendo le coordinate istantanee del punto in alto a sinistra del DIV dovresti riuscire ad inserire i controlli relativi alla posizione del contenitore

[Mega69]

Praticamente tutte le librerie lo permettono. Ho provato a fare qualche ricerca ma non sono riuscito a trovare niente.
Casomai prova ad usare dom-drag, un altra libreria dedicata al drga and drop leggera ma potente.

[nrocco]

oppure prova qui:
http://www.openrico.org/demos?demo=drag_and_drop_simple

[tourmark]

Ciao,
Oggi stavo faccendo proprio quello che avevi bisogno.
Bastava guardare nella documentazione del script.aculo (vedi functional test: dragdrop6.html)

<div class="padre" id="padre" style="background: url(griglia.jpg) no-repeat top left; height:482px; width:373px; border:1px solid black; margin:0px; padding:0px;">
  <div id="box1" class="box1" style="z-index:1000;width:150px;height:150px;background:#bbf;">
  Trascinami
</div>
<script type="text/javascript" language="javascript" charset="utf-8">
// <![CDATA[
  new Draggable('box1',{
    snap: function(x,y,draggable) {
      function constrain(n, lower, upper) {
        if (n > upper) return upper;
        else if (n < lower) return lower;
        else return n;
      }

      element_dimensions = Element.getDimensions(draggable.element);
      parent_dimensions = Element.getDimensions(draggable.element.parentNode);
      return[
        constrain(x, 0, parent_dimensions.width - element_dimensions.width),
        constrain(y, 0, parent_dimensions.height - element_dimensions.height)];
    },
    revert:true
  });
// ]]>
</script>

[StelK]

Grazie mille...
avevo guardato nella documentazione ma ti assicuro che non avevo trovato.. evidentemente non avevo cercato con abbastanza attenzione
Grazie di nuovo,
Ciao