title: css scale image toward specific direction
body: <p>I have the following CSS which allows me to scale an image with an effect. The code works properly scaling the image x6 times. </p>
  
  <pre><code>#helloi {
      width="65px";
      text-decoration: none;
      display: block;
      margin: 0 3px 3px 0;
      opacity: 1;
      -webkit-transform: scale(1, 1);
      -webkit-transition-timing-function: ease-out;
      -webkit-transition-duration: 250ms;
      -moz-transform: scale(1, 1);
      -moz-transition-timing-function: ease-out;
      -moz-transition-duration: 250ms;
  }
  #helloi:active {
      width="65px";
      opacity: .9;
      -webkit-transform: scale(6, 6);
      -webkit-transition-timing-function: ease-out;
      -webkit-transition-duration: 250ms;
      -moz-transform: scale(6, 6);
      -moz-transition-timing-function: ease-out;
      -moz-transition-duration: 250ms;
      position: relative;
      z-index: 99;
  }
  </code></pre>
  
  <p>Now I'd like to be able to scale it but toward a specific direction, instead of being scaled to the center, I'd like it to size up toward right respecting its original left side position. here you have a jsfiddle example (click on the image) <a href="https://jsfiddle.net/nh40s9sf/" rel="noreferrer">https://jsfiddle.net/nh40s9sf/</a> </p>