CODEWITHSUNDEEP
javascriptimagepluginsckeditorpreload
Mark
Mark

Reputation: 3271

CKEditor Getting image width and height before inserting element (preloading)

Is there a way of getting the width and height of an image before actually inserting it into the editor?

I have the following code, but width and height always return 0

var imageElement = editor.document.createElement('img');
imageElement.setAttribute('src', imageSource);

var width = imageElement.$.width;
var height = imageElement.$.height;

if (width > 0) {
    this.imageElement.setAttribute('width', width);
}
if (height > 0) {
    this.imageElement.setAttribute('height', height);
}

editor.insertElement(imageElement);

Help would be greatly appreciated

Upvotes: 1

Views: 779

Answers (1)

Mark
Mark

Reputation: 3271

I fixed this problem by preloading the image manually, however I do not know if this is the CKEditor way to achieve this

Code:

var imageElement = editor.document.createElement('img');
imageElement.setAttribute('src', imageSource);

function setWidthAndHeight() {
    if (this.width > 0) {
        imageElement.setAttribute('width', this.width);
    }
    if (this.height > 0) {
        imageElement.setAttribute('height', this.height);
    }
    return true;
}

var tempImage = new Image();
tempImage.src = imageSource;
tempImage.onload = setWidthAndHeight;

editor.insertElement(imageElement);

Upvotes: 1

Related Questions