JavaScript - получить ширину элемента при переходе CSS - PullRequest
Новая
       9

JavaScript - получить ширину элемента при переходе CSS

0 голосов
/ 02 января 2019

Я хочу отобразить ширину элемента в JavaScript. Эта часть уже работает, но вот моя проблема: Когда ширина элемента анимирована, во время анимации я хочу видеть реальную ширину элемента, а не ширину конечного элемента.

Я работаю с Angular, и то, что я хотел сделать, стало возможным благодаря включению JQuery с использованием функции $(el).width(), но я хочу удалить использование JQuery.

Я уже пробовал (при условии, что el является элементом HTML): 

el.offsetWidth
el.clientWidth
el.scrollWidth
el.getBoundingClientRect().width

1 Ответ

0 голосов
/ 02 января 2019

Некоторое время назад я столкнулся с той же проблемой, с изображениями, которые еще не загружены и имели размер 0. Я исправил проблему с помощью следующего кода, чтобы получить исходный размер изображения.Убедитесь, что вы продолжаете свой код внутри функции onload 

var image = new Image();
image.onload = function() {

    // set its dimension to target size
    var width = image.width;
    var height = image.height;
};
image.src = el.img;

Это также возможно сделать со строкой base64, если необходимо 

var image = new Image();
image.onload = function() {

    // set its dimension to target size
    var width = image.width;
    var height = image.height;
};
image.src = "data:image/jpg;base64," + img;
...