Frage Machen Sie
resizeable


Gibt es eine Möglichkeit, einen <div> Container mit drag'n'drop in der Größe veränderbar zu machen? Damit kann der Benutzer die Größe mit Drag'n'Drop ändern?

Jede Hilfe würde wirklich geschätzt werden!


23
2017-12-24 13:48


Ursprung


Antworten:


http://docs.jquery.com/UI/Resizables

Einige ihrer Dokumente scheinen im Moment nicht verfügbar zu sein. Für Arbeitsbeispiele siehe hier

http://batiste.dosimple.ch/blog/posts/2008-05-18-1/jquery-drag-and-drop-and-resize-event-delegation.html


11
2017-12-24 13:56



Die beste Methode wäre die Verwendung von CSS3. Es wird von mindestens Webkit und Gecko unterstützt.

Entsprechend der w3c spezifikation:

div.my_class {
    resize:both;
    overflow:auto; /* something other than visible */
}

Webkit und Firefox interpretieren die Spezifikationen nicht auf die gleiche Weise. In Webkit ist die Größe auf die eingestellte Breite und Höhe beschränkt. Es gibt noch eine andere Frage: Wie kann ich CSS verwenden, um ein Element auf eine kleinere Größe als die ursprüngliche Größe zu bringen? diesbezüglich.


37
2017-12-24 16:35



wenn Sie eine Funktion ausführen müssen doOnResize (Tag) für jedes Tag (auch das <div>) unter dem Array von mussbewertbar sein  Stichworte, Sie könnten dieses Array einfach nach kopieren Fensterist eins:

window[WIN_RESIZED] = [] // init the window's array
for (var i in tags) {      
  window[WIN_RESIZED].push(tags[i])
}

und danach

window.addEventListener('resize', function(e){
  for (var i in window[WIN_RESIZED]) {
    doOnResize(window[WIN_RESIZED][i])
  }
})

wo irgendwo am Anfang geschrieben werden muss

const WIN_RESIZED = 'move_resized_divs'

mit beliebigem Namen wie 'move_resized_divs"


0
2017-08-17 08:26



.resizable-content {
    min-height: 30px;
    min-width: 30px;
    resize: both;
    overflow: auto;
    max-height: fit-content;
    max-width: fit-content;
}

0
2018-02-19 15:08