Функција scale
Функцијата scale скалира елемент:
го зголемува или намалува за одреден
број пати. Скалирањето се извршува околу
точката зададена со својството transform-origin.
Може да прифати еден или два параметри, наведени со запирка. Ако параметрите се два - првиот параметар задава скалирање по хоризонтала, а вториот - по вертикала. Ако параметарот е еден тогаш тој задава скалирање по хоризонтала и вертикала истовремено.
Вредноста на параметрите е цел или децимален
број. Ако е поголем од 1 - елементот се зголемува,
ако е помал (на пример, 0.5) - елементот
се намалува. Ако се зададе 1 - ништо нема да се промени
(тоа е стандардната вредност).
Синтакса
селектор {
transform: scale(еден или два броја);
}
Пример
При посета на блокот ќе го зголемиме скалато за 1.5
пати по двете оски:
<div id="elem">lorem ipsum</div>
#elem {
border: 1px solid black;
width: 100px;
height: 50px;
}
#elem:hover {
transform: scale(1.5);
}
:
Пример
Ќе го намалиме скалато за 2 пати по двете оски:
<div id="elem">lorem ipsum</div>
#elem {
border: 1px solid black;
width: 100px;
height: 50px;
}
#elem:hover {
transform: scale(0.5);
}
:
Пример
Ќе го зголемиме скалато за 2 пати по оската X:
<div id="elem">lorem ipsum</div>
#elem {
border: 1px solid black;
width: 100px;
height: 50px;
}
#elem:hover {
transform: scale(2, 1);
}
:
Пример
Ќе го зголемиме скалато за 2 пати по оската Y:
<div id="elem">lorem ipsum</div>
#elem {
border: 1px solid black;
width: 100px;
height: 50px;
}
#elem:hover {
transform: scale(1, 2);
}
: