Lines Matching refs:transform
1 # Animation with the transform Attribute
4 Set the transform attribute for component rotation, scaling, translation, and skewing.
41 transform: rotate(45deg);
56 transform: translate(150px,-137px);
65 transform: translate(-150px,-400px) scale(1.5);
89 transform: translate(200px,-710px) skewX(-5deg);
135 transform: translate(0px,0px);
139 transform: translate(10px,900px);
143 transform: translate(20px,500px);
147 transform: translate(30px,900px);
151 transform: translate(40px,700px);
154 transform: translate(50px,900px);
157 transform: translate(60px,800px);
160 transform: translate(70px,900px);
163 transform: translate(80px,850px);
167 transform: translate(90px,900px);
177 Set the rotation center around an element in different transform-origin positions. Of the **rotate3…
221 transform-origin: 10% 10px;
226 transform-origin: right bottom;
230 transform: rotate(0deg)
233 transform: rotate(360deg);
279 transform:rotate3d(0,0,0,0deg)
282 transform:rotate3d(20,20,20,360deg);
285 transform:rotate3d(0,0,0,0deg);
291 transform:rotate3d(0,0,0,0deg)
294 transform:rotate3d(0,0,10,30deg);
297 transform:rotate3d(0,0,10,-30deg);
300 transform:rotate3d(0,0,0,0deg);
309 > **transform-origin** specifies the origin of an element's transformation. If only one value is se…
366 transform: scale(1);
370 transform: scale(3);
374 transform: scale(1);
395 transform: scale3d(1, 1, 1);
398 transform: scale3d(1.25, 0.75, 1.1);
401 transform: scale3d(0.75, 1.25, 1.2);
404 transform: scale3d(1.15, 0.85, 1.3);
407 transform: scale3d(.95, 1.05, 1.2);
410 transform: scale3d(1.05, .95, 1.1);
413 transform: scale3d(1, 1, 1);
422 > After the **transform** attributes are set, the child element changes with the parent element. Va…
453 transform: matrix(1,0,0,1,0,0);
456 transform: matrix(1,0,0,1,0,200);
459 transform: matrix(2,1.5,1.5,2,0,700);
462 transform: matrix(1,0,0,1,0,0);
470 ## Integrating transform Attributes
472 You can set multiple **transform** attributes at the same time to apply different transformations t…
533 transform: translate(0,0); transform: rotate(0deg)
536 transform: translate(0,500px);
537 transform: rotate(360deg)
543 transform:translate(0,0) rotate(0deg) ;
546 transform: translate(300px,0) rotate(360deg);
551 transform:rotate(0deg) translate(0,0);
554 transform:rotate(360deg) translate(300px,0);
560 transform: scale(0.5);
563 transform:scale(2) rotate(45deg);
569 transform:scale(0) translate(0,0) rotate(0);
572 transform: scale(1.5) rotate(360deg) translate(200px,0);
581 …transform** attributes are set, the later one overwrites the previous one. To apply multiple trans…
585 > - The style values in the **transform** attribute used when the animation starts and ends must be…