Функција 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);
}
:
