transform

Use this function to apply transforms to an element.

Usage

import { transform } from '@studiometa/js-toolkit/utils';

transform(document.body, {
  x: 100,
  scale: 0.5,
});

transform([document.body, document.documentElement], {
  x: 100,
  scale: 0.5,
});

transform(document.querySelectorAll('div'), {
  x: 100,
  scale: 0.5,
});

Parameters

• element (HTMLElement | HTMLElement[] | NodeListOf<HTMLElement>): the target HTML element
• props (TransformProps): an object describing the transformations to apply

Return value

A string representing the transform property value.

Types

interface TransformProps {
  x?: number;
  y?: number;
  z?: number;
  rotate?: number;
  rotateX?: number;
  rotateY?: number;
  rotateZ?: number;
  scale?: number;
  scaleX?: number;
  scaleY?: number;
  scaleZ?: number;
  skew?: number;
  skewX?: number;
  skewY?: number;
}