Jakiej jednostki najczęściej używacie dla funkcji rotate? Jaka jest konwencja? Widziałam że jest deg, turn, rad też wchodzi. Stosuje się raczej deg?
- Rejestracja:około 6 lat
- Ostatnio:około 2 godziny
- Postów:141
Dla kątów będących wielokrotnością typowych wartości (n×30º, n×45º) łatwiej używać deg (ktoś pamięta ile radianów ma 90º?). Dla kątów wyliczanych (np. nachylenie 1:4) — rad.

ktoś pamięta ile radianów ma 90º?
chyba każdy kto nie spał na matmie. No ale zgoda, że bardziej naturalne dla człowieka są stopnie.
.rotate90 { transform: rotate( calc( 3.141592653589793rad / 2 ) ); }
chociaż 1.57rad
pewnie by wystarczyło.


- Rejestracja:ponad 6 lat
- Ostatnio:6 dni
- Lokalizacja:Silesia/Marki
- Postów:5505
-daniel- napisał(a):
Dla kątów będących wielokrotnością typowych wartości (n×30º, n×45º) łatwiej używać deg (ktoś pamięta ile radianów ma 90º?). Dla kątów wyliczanych (np. nachylenie 1:4) — rad.
2 pi rad to cały okrąg, więc 90 stopni to 1/2 pi radiana. Sprawdziłem na wiki i dobrze pamiętam :D

- Rejestracja:około 11 lat
- Ostatnio:40 minut
- Postów:8398
No tak, to wiadomo (i każdy to powinien pamiętać, kto chce używać funkcji trygonometrycznych w programowaniu). Tylko pytanie, czy w CSS jest łatwy sposób na użycie liczby pi z dużą dokładnością (w JS jest, bo Math.PI, a w CSS?).
No i stopnie są wygodniejsze w obsłudze przez człowieka i CSS ma wbudowaną ich obsługę (w przeciwieństwie do JSa). Więc obstawiałbym przy deg, jeśli nie ma innej potrzeby.
turn
O, faktycznie. Nie wiedziałem o tej jednostce. Ale dla mnie to trochę przerost formy nad treścią, chociaż w sumie może to być przydatne pewnie przy robieniu kilku obrotów (np. 7turn zamiast liczyć ile to jest w stopniach).
- Rejestracja:około 6 lat
- Ostatnio:około 2 godziny
- Postów:141
Powyżej w komentarzu napisałem, ze pewnie 1.57rad
zamiast 90º
pewnie by wystarczyło. Okazuje się, że czasami taka dokładność może być za mała.
https://jsfiddle.net/vjmfs25o/
<html>
<head>
<style>
.leftbox
{
position: absolute;
left: 20px;
top: 20px;
width: 500px;
height: 1000px;
background-color: #000;
}
.rightbox
{
position: absolute;
left: 270px;
top: 270px;
width: 1000px;
height: 500px;
background-color: #444;
transform: rotate( -1.57rad );
}
</style>
</head>
<body>
<div class="leftbox"></div>
<div class="rightbox"></div>
</body>
Dla pełnych kątów zdecydowanie lepiej używać wartości wyrażonych w stopniach.
P.S.
Dla webmasterów wkuwających radiany na pamięć, pamiętać minimum 4 miejsca po przecinku.

- Rejestracja:około 5 lat
- Ostatnio:około 5 lat
- Postów:3
Czy ktoś jest w stanie pomóc jaki sposób wyśrodkować obracanie według środka obiektu a nie od górnej lewej krawędzi? W linku poniżej jak przykład. Próbowałem już za pomocą translate(150px,200px) ale coś nie chce przesunć...
https://jsfiddle.net/D4NI3L/uq2hy59c/3/
Jest jakiś na to dodatkowy sposób?

- Rejestracja:ponad 6 lat
- Ostatnio:6 dni
- Lokalizacja:Silesia/Marki
- Postów:5505
Juhas napisał(a):
Ja bym uderzył, że kwaterion. Przynajmniej w grach. Tak mi się wydaje.
Ale przecież kwaterion to liczba a nie jednostka. I poza tym używana w grafice 3D a nie w CSS
Po przeczytaniu wypowiedzi stwierdzam że moja osobista lista preferencji to:
- turn - do ćwiartek obrotu włącznie
- deg - dla różnic mniejszych niż ćwiartka
- grad - w zasadzie nie wiem po co są skoro mamy stopnie
- rad - niestety CSS nie ma zdefiniowanej stałej Pi. Chociaż w SCSS można zdefiniować, ale nie widać zalet
.__.