У меня есть изображение (обозначено зеленым цветом), наложенное на прямоугольник (обозначено синим цветом), и изображение будет размером transform: scale(). Когда это происходит, мне нужно, чтобы все края изображения завершились одновременно.
Для этого мне нужно вычислить transform-origin на основе того, где изображение расположено поверх ограничительной рамки, используя JavaScript. Предположим, я знаю все координаты, которые getBoundingClientRect() предоставляет для обоих элементов.
В шести приведенных ниже примерах я поместил красную точку, где должны пересекаться проценты источника преобразования.
Я просто не могу понять математику, чтобы туда добраться. Самый близкий к поиску ответа я пришел с этим вопросом , но он немного расплывчатый, и я не уверен, что полностью понимаю сам ответ. Я был бы очень признателен за помощь в этом и с радостью предоставлю более подробную информацию, если я что-то упустил.
