- This topic is empty.
Viewing 8 posts - 1 through 8 (of 8 total)
Viewing 8 posts - 1 through 8 (of 8 total)
- The forum ‘CSS’ is closed to new topics and replies.
The forums ran from 2008-2020 and are now closed and viewable here as an archive.
Hi there,
I’m interested to understand CSS3 3d function by experimenting it. between different function for 3d trasnform we have rotate3d() function but it is not clear to me.
for example I want to rotate something 45 deg in X and Y axis.
I can write:
**transform: rotateX(45deg) rotateY(45deg);**
I tried to use rotate3d function so i wrote:
**transform: rotate3d(1,1,0, 45deg);**
but the result is not equal !!
in W3C spec we have:
> specifies a 3D rotation by the angle specified in last parameter about the [x,y,z] direction vector described by the first three parameters. A direction vector that cannot be normalized, such as [0,0,0], will cause the rotation to not be applied
this definition is not clear. what is direction vector?
how can i write the **transform: rotateX(45deg) rotateY(45deg);** with rotate3d function and have the same result?
thanks in advance
;)
thanks Paulie_D
I’ve read this one but I can not reproduce transform: rotateX(45deg) rotateY(45deg); with rotate3d
Then I suggest that you put what you have into a Codepen example and let us play.
This is Codepen example:
So, if I understand it correctly, you want the black square to look the same as the grey square?
yes, exactly ;)
This is obvously post mortem but, just for sake of it, the 3d transformation you are looking for is roughly rotate3d(1, 1, .45, 60deg)
.