Class Media_Image_Cropper

constructor

• new Media_Image_Cropper(): Media_Image_Cropper

  Returns Media_Image_Cropper

StaticstdExp

Staticfunctionality

• functionality(toLoad: { [key: string]: unknown }, toProcess: Element): void

  Diese Funktionalität bietet ein Bild-Cropper (https://fengyuanchen.github.io/cropperjs/). Damit es auch in sich wiederholenden Containern funktioniert, muss „data-cb-func“ auf den ersten äußersten Container gesetzt werden das ist nicht das Wiederholende selbst, sondern liegt im Wiederholenden.

  Konfigurationsparameter:

  • Container: Der CSS-Selektor des HTMLDivElement, der die Cropper-UI enthalten soll.
  • Ziel: Der CSS-Selektor des HTMLImageElement, der danach das zugeschnittene Bild enthält Klicken Sie auf „Updater“.
  • Datei: Der CSS-Selektor des HTMLInputElement vom Typ = „Datei“, in dem das Bild zum Zuschneiden ausgewählt werden soll.
  • Updater: Der CSS-Selektor, der den HTMLButtonElement angibt, der beim Klicken eine Aktualisierung des „Ziels“ bewirkt.
  • ImageURL Der CSS-Selektor, der den HTMLInputElement angibt, der die Bilddaten empfangen soll.
  • AspectRatio: Das beizubehaltende Seitenverhältnis des optionalen Croppers (z. B. 16/9 oder 4/3). Wenn Sie diesen Wert festlegen, kann die Größe des Zuschneidetools nicht geändert werden.
  • OutputWidth Die Breite in Pixel für die Leinwand, auf der der zugeschnittene Bereich wiedergegeben werden soll. Bei Bereitstellung als Zeichenfolge beträgt der Mindestwert 100. Der Standardwert ist 1000 Pixel.
  • CSSCropperHandle Das CSS, das auf jedes angewendet werden soll (standardmäßig Hintergrundfarbe: dunkelorange ;).

  Parameters

  • toLoad: { [key: string]: unknown }

    Provided by the CodBi.

  • toProcess: Element

  Returns void