Как пересчитать позицию фона в процентах относитльно внутреннего элемента?

Question

[IvanKalinin]

Всем доброго.

Есть прямоугольный родительский блок, который содержит background-image, background size, и background-position в процентах, соответственно относительно родителя. Внутри блока есть круглый (или квадратный, суть одна и та же) блок. Спозиционированный абсолютно по середине родителя.

Задача - пересчитать background-position в процентах относительно внутреннего элемента, так, чтобы если применить тоже самое изображение с тем же самым размером выглядило одинаково, когда этот внутренний блок будет уже самостоятельным, т.е. без прямоугольного родителя.

https://cloud.mail.ru/public/E3rF/jYTHCDLQw

Answer 1

[Андрей Федоров]

А зачем ее пересчитывать если у вас все по центру?
codepen.io/aliencash/pen/mPmpOe?editors=1100

Comments

[IvanKalinin]

Потому что это просто частный пример. Позиция может быть любой

[Андрей Федоров]

To_wave: Хорошо, а почему не дать внутреннему блоку просто прозрачный фон тогда?

[IvanKalinin]

Потому что, если я не понятно описал суть задачи, за что извиняюсь, внутренний элемент (точнее его "копия") будет самостоятельным. Т.е. фактически это получение размера и позиции изображение для, например, аватара. В первом случае я получаю данные, во втором я их применяю в другом месте.

[Андрей Федоров]

To_wave: Т.е. вам нужно вырезать и показать кусок изображения, который вы визуально выделяете на его полной версии, так что ли?

[IvanKalinin]

Да. Показать этот кусок используя оригинальное изображение. Если вырезать, то можно и canvas использовать с переводом в base64. Но идея именно в сохранении оригинального изображения

[Андрей Федоров]

To_wave: Ну тогда на js только высчитывать...

[IvanKalinin]

Андрей Федоров: Ну до этого я догадался, и JS тег был добавлен с вопросом. Ну и слово "формула" подразумевает рассчеты.