0

I'm trying to apply transform-origin in order to transform an image downwards. If I apply the transform-origin with scale-only, I seem to get the expected result, that the image scales downwards:

transformOrigin: 50% 0%;
transform: scale(2);

But if I also translate the image, the transform origin seems to make the image scale more downwards, but also a littelbit upwards:

  transformOrigin: 50% 0%;
  transform: scale(2) translateY(20px);
Himmators
  • 14,278
  • 36
  • 132
  • 223
  • I don't understand "more downwards, but also a littelbit upwards". Your wording seems contradictory. It behaves as expected for me. – Oriol Dec 28 '16 at 17:13
  • 1
    With your second sample, it first moves, then it scale (transform execute its commands right to left) ... so I guess that explains it, so to first scale then translateY, switch their order – Asons Dec 28 '16 at 17:20
  • @LGSon Maybe. I don't understand the question – Oriol Dec 28 '16 at 17:33
  • @Oriol Since the `translateY` executes before `scale`, it moves down a little, then up again affected by the scale ... which I'm sure the _first downwards, then a little upwards_ mean :) ... opposed to not use `translateY` – Asons Dec 28 '16 at 17:37
  • _Himmators_ låter skånskt? ... eller en håla utanför storstan :) – Asons Dec 28 '16 at 17:51
  • Himmators allows Scanian? ... Or a den outside of the big city – vals Dec 28 '16 at 21:35
  • @LGSon ... odd ... 2 people from Sweden, 2 from Barcelona – vals Dec 28 '16 at 21:46
  • @vals Yes :) ... and "Himmators låter skånskt? = Himmators sounds like _south-swedish_?" – Asons Dec 29 '16 at 05:59

0 Answers0