Css3 преобразовать масштаб палку к нижней

Можно ли использовать свойство transform: scale (x), сохраняя при этом элемент, прикрепленный к нижней части страницы? (по умолчанию, если масштабируется относительно центра элемента, как показано ниже)

default scale behavior
(источник: w3schools.com)

Ответы

Ответ 1

используйте свойство transform-origin:

element{
    -webkit-transform : scale(0.5);
    -moz-transform : scale(0.5);
    -o-transform : scale(0.5);
    -ms-transform : scale(0.5);
    transform : scale(0.5);

    -webkit-transform-origin : 50% 100%;
    -moz-transform-origin : 50% 100%;
    -o-transform-origin : 50% 100%;
    -ms-transform-origin : 50% 100%;
    transform-origin : 50% 100%;
}

Здесь живая демонстрация, которая показывает transform-origin в действии.

Ответ 2

возникает вопрос, можете ли вы выбрать, какая ось для объекта. Я не знаю ответа на это, и я предполагаю, что это, вероятно, не так.

если вы действительно не можете установить "ось", вам придется преобразовать поле при одновременном перемещении.