Συνάρτηση scaleX
Η συνάρτηση scaleX κλιμακώνει ένα στοιχείο
κατά τον άξονα X. Η κλιμάκωση πραγματοποιείται
γύρω από ένα σημείο, που ορίζεται από την ιδιότητα transform-origin.
Η τιμή της συνάρτησης είναι ένας ακέραιος ή δεκαδικός
αριθμός. Εάν είναι μεγαλύτερος από 1 - το στοιχείο μεγαλώνει,
εάν είναι μικρότερος (για παράδειγμα, 0.5) - το στοιχείο
μικραίνει. Εάν οριστεί 1 - τίποτα δεν αλλάζει
(αυτή είναι και η προεπιλεγμένη τιμή).
Σύνταξη
επιλογέας {
transform: scaleX(αριθμός);
}
Παράδειγμα
Όταν το ποντίκι περνάει πάνω από το μπλοκ, θα αυξήσουμε την κλίμακα κατά 1.5
φορές κατά τον άξονα X:
<div id="elem">lorem ipsum</div>
#elem {
border: 1px solid black;
width: 100px;
height: 50px;
}
#elem:hover {
transform: scaleX(1.5);
}
:
Παράδειγμα
Όταν το ποντίκι περνάει πάνω από το μπλοκ, θα μειώσουμε την κλίμακα κατά 2
φορές κατά τον άξονα X:
<div id="elem">lorem ipsum</div>
#elem {
border: 1px solid black;
width: 100px;
height: 50px;
}
#elem:hover {
transform: scaleX(0.5);
}
:
