jQuery-Plug-in Resizable

jQuery.resizable ist ein auf jQuery basierendes Plug-in, das Benutzern das Verhalten zur Größenänderung von HTML-Doms bietet.

Zum Beispiel existiert das folgende HTML-Dom:

Nehmen Sie an, dass p im gesamten blauen Rand ein Objekt ist, dessen Größe geändert werden muss. Der rote Teil im Bild ist der „Griff“. Mit dem „Handle“ ändert sich die Größe von p.

Sie können den Quellcode zuerst hier herunterladen: jQuery.resizable.js

API-Einführung:

handler(String|Object): Ziehen Ziehgriff, z. B. ein allgemeines Fenster, die untere rechte Ecke ist der Ziehgriff. Wenn Sie auf den Ziehgriff klicken, werden Länge und Breite des gesamten Objekts geändert. Der Standardwert ist null und muss angegeben werden. Es kann sich um ein jQuery-Filterobjekt handeln, z. B. „.resize“ oder „#resize“, aber auch um ein jQuery-Objekt, z. B. $('.resize'),
min(Object): JSON-Objekt, einschließlich zwei Eigenschaften, Breite und Höhe, dh Änderung Die minimale begrenzte Länge und Breite der Objektgröße, der Standardwert ist { Breite: 0, Höhe: 0 },
max(Object): JSON-Objekt, einschließlich zwei Attribute, Breite und Höhe, dh Änderung der maximal begrenzten Länge und Breite der Objektgröße, der Standardwert ist { width: $(document).width(), height: $(document).height() },
onResize(Funktion): löst Ereignis Während der Größenänderung übergibt das skalierbare Plug-in einen Parameter an diese Methode. Weitere Informationen finden Sie im Quellcode und in der Demo. Der Standardwert ist: function() { },
onStop (Funktion): Triggerereignis am Ende der Größenänderung. Weitere Informationen finden Sie im Quellcode und in der Demo.

Hinweise:

Da onResize jedes Mal ausgelöst wird, wenn sich die Größe ändert, sollten Sie die Verarbeitung übermäßig komplexer Inhalte oder einer häufigen Erfassung vermeiden von

dom-Objekten führt dazu, dass sich die Größe des Objekts ändert und nicht mit den Bewegungen der Maus mithalten kann. Sie können einige Tricks anwenden, um damit umzugehen (z. B. wenn width%2==0?). .

Online-Demo: Live-Demo

Das obige ist der detaillierte Inhalt vonjQuery-Plug-in Resizable. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!