Scriptaculous Drag begrenzen?

[Click]

Guten Tag )

Weiß jemand, wie ich mit Scriptaculous bei einem "Draggable" einen bestimmten Bereich einstelle, in dem es nur bewegt werden kann?

Wenn ich zB ein DIV Container hab und dort ein Bild drin ist, was ich mit Scriptaculous zum Draggable gemacht habe, sollte dieses Bild im Bewegungsbereich auf das Div beschränkt sein, damit ich es nicht darüber hinweg ziehen kann.

Oder muss ich mir da selber nen Workaround zusammenwurschteln?

Danke,

Click

[Kropff]

also wenn ich mich an die beispiele erinnere, gab es so was nicht. da musst du wohl selber was bauen. ansonsten klick dich mal durch die beigelegten beispiele, vielleicht ist doch was dabei.

peter

[Click]

So.. eine wirkliche Option dafür gibt es nicht, jedoch habe ich in den Tests folgendes gesehen, wo die beschriebene Situation mit Hilfe der "snap" Option umgesetzt wird.. also falls es noch jemand sucht: Man kanns zum Beispiel so machen:

new Draggable('box-grid-procedural-gets-draggable',{
  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
});

[singsang]

Verbesserungsvorschlag

So.. eine wirkliche Option dafür gibt es nicht, jedoch habe ich in den Tests folgendes gesehen, wo die beschriebene Situation mit Hilfe der "snap" Option umgesetzt wird.. also falls es noch jemand sucht: Man kanns zum Beispiel so machen:

new Draggable('box-grid-procedural-gets-draggable',{
  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
});

Hallo!
Bin zwar das erste Mal in diesem Forum aber das Skript hat mir geholfen.
Es hat sich aber ein kleiner Fehler eingeschlichen. In der Zeile:

parent_dimensions=element.getDimensions ....

muss man element groß schreiben:
parent_dimensions=Element.getDimensions(draggable.element.parentNode);

So klappts bei mir!

Sers!