Library for creating custom image elements on Furaffinity
이 스크립트는 직접 설치하는 용도가 아닙니다. 다른 스크립트에서 메타 지시문 // @require https://update.greasyfork.org/scripts/492931/1656707/Furaffinity-Submission-Image-Viewer.js을(를) 사용하여 포함하는 라이브러리입니다.
Library for creating image elements on Furaffinity. Also see docs on Furaffinity-Submission-Image-Viewer
@require this script
Create a new Custom Image Viewer:
const baseElem = document.createElement("div");
const faImageViewer = new FAImageViewer(baseElem, imgSrc, prevSrc);
faImageViewer.load(); // starts loading the image
Optional: Subscribe to Events:
faImageViewer.onImageLoad(() => doSomething()); // occurs if the image is fully loaded
faImageViewer.onImageLoadStart(() => doSomething()); // occurs if the image started loading
faImageViewer.onPreviewImageLoad(() => doSomething()); // occurs if the preview image fully loaded
⠀⠀⠀⠀
faImageViewer.addEventListener("imageLoad", () => doSomething()); // alternative to onImageLoad
faImageViewer.addEventListener("imageLoadStart", () => doSomething()); // alternative to onImageLoadStart
faImageViewer.addEventListener("previewImageLoad", () => doSomething()); // alternative to onPreviewImageLoad
| Feature | Status |
|---|---|
| Support preview image | ✅ Completed |
| Have different events for image loading ⠀⠀⠀⠀ | ✅ Completed |
The CustomImageViewer class contains following Properties:
imageUrl - the image urlpreviewUrl - the preview image urlparentContainer - the parent container on which the image will be createdfaImage - the image elementfaImagePreview - the preview image elementonImageLoad - the callback for when the image is fully loadedonImageLoadStart - the callback for when the image starts loadingonPreviewImageLoad - the callback for when the preview image is fully loadedFunctions:
load() - starts loading the imagereset() - resets the image