Recently, I've been attempting to programmatically transform an HTML element. Strangely, when I update the transform value in the console tab, it changes successfully, but for some reason it doesn't reflect in the element tab of the browser.
onDragStart(element: HTMLElement) {
this.elementRef = element;
var style = window.getComputedStyle(element);
var matrix = new WebKitCSSMatrix(style.webkitTransform);
this.translateY = matrix.m42;
console.log(this.translateY) //outputs: 85, because its current Y-location is 85px
element.style.transform = "translate( 0px," + this.translateY + "px)";
console.log(element);
}
I've been troubleshooting this issue for the past 24 hours, but I can't seem to figure out where I'm going wrong. Any guidance would be greatly appreciated.