jQuery Ziehbare und Überlaufproblem [geschlossen]

Question

Ich habe einen unerwünschten Effekt, wenn ich ein div aus einem Behälter div ziehen, die als Überlauf gesetzt. Blättert

Ich habe ein Beispiel für jemanden anderen, wo sie das Problem gehabt haben gefunden, aber ich habe es nicht gelungen, eine Lösung zu finden

Beispiel auf Einfügen ist

Was passiert, ist, dass die Scroll nur erhöht werden, kann ich sehen, warum dies das gewünschte Verhalten wäre, wenn Sie zu einem Ziel innerhalb des scrollbaren div ziehen wollen, aber ich mag es nehmen außerhalb seiner Rolle im Griff können.

Answer 1

Es lohnt sich auf jeden Fall die Aufmerksamkeit auf die Dokumentation zu zahlen

http://docs.jquery.com/UI/Draggable#option-scroll

  

Blätter

     

Typ: Boolean
   Standard: true
  Wenn auf true, Container Auto-Rollen beim Ziehen.

Alle, die hier eingeben, erfahren Sie aus meinem Fehler, RT (F) M !!!

Answer 2

Ich hatte ein ähnliches Problem, einen Widerstand zwischen zwei Überlauf-Auto divs ermöglicht. Mit Hilfe der früheren Antworten, fand ich, dass diese Kombination funktioniert für mich (Safari 5.0.3, jquery-1.4.4, jquery-ui-1.8.7):

appendTo: 'body',
containment: 'window',
scroll: false,
helper: 'clone'

Answer 3

appendTo

Element, SelectorDefault: 'Eltern'

Das Element übergeben oder durch die appendTo Option ausgewählt wird während ziehen als die ziehbar Helfer Behälter verwendet werden. Standardmäßig wird der Helfer auf den gleichen Behälter wie die ziehbar angehängt.

Code-Beispiele Initialisieren eines ziehbar mit der appendTo Option angegeben.

$('.selector').draggable({ appendTo: 'body' });

Answer 4

Die Klon-Lösung funktioniert, hat aber zwei Probleme.

Erstens: der Klon an den Körper anhängen. Abhängig von Ihrem CSS, kann Ihr Element die Stile ändern, da, bevor es beginnt, ist es innerhalb eines anderen Elements und während des Ziehens, wird es direkt auf dem Körperelement sein.

Zweitens:. Manchmal muss das Element bewegen, und der Klon, der das Objekt dort lassen

So ist die Lösung für diese Probleme ist:

$('.selector').draggable({
    helper: 'clone',
    start: function(){
        $(this).hide();             
    },
    stop: function(){
        $(this).show()
    }
});

Answer 5

die Scroll-Option Einstellung nicht Kinder aus dem versteckt in dem Überlaufbereich zu stoppen. Ich habe mit einer Arbeit-a-Runde kommen, die die Helfer Option verwendet. Check it out:

http://pastebin.me/164f0a4073496563fe3179ddcec5fd6d

Auch hier ist ein Verweis auf eine andere Stelle habe ich:

jQuery UI ziehbare Elemente nicht 'ziehbar' außerhalb des Scrollens div

Answer 6

Sie können auch angeben, welche Sie Arten von Elementen wollen nicht enthalten.

<div class="draggable"> 
    <h2>This will drag the div</h2>
    <ul>
       <li>This won't drag the div</li>
    </ul>
</div>

Wenden Sie diese Eigenschaft kündigt das Ereignis in bestimmten untergeordneten Elementen ignorieren

$('.draggable').draggable({cancel : 'ul'});