title: Using domElement input text and resizing canvas
body: <p>I'm using a script to "convert" a createjs.Text object to a domElement with textinput. This works ok, but when I'm resizing the canvas, the domElement (htmlelement) won't resize along with it.
  It won't move to the correct position.</p>
  
  <p>I have a jsfiddle here (press button) to show what I'm trying to do: <a href="http://jsfiddle.net/onhuf499/13/" rel="nofollow">jsFiddle</a>
  I'm overwriting a Text object with a domElement, but because I'm also resizing the canvas it will not stay at the same place.</p>
  
  <pre><code>&lt;script src="https://code.createjs.com/createjs-2013.12.12.min.js"&gt;&lt;/script&gt;
  &lt;script&gt;
      var stage,container,inputElement,text;
      function init() {
          stage = new createjs.Stage("demoCanvas");           
          createjs.Ticker.on("tick", tick);
  
          container = new createjs.Container();
      container.x = 100;
      container.y = 100;
          stage.addChild(container);
  
          text = new createjs.Text("testText", "35px Arial", "#0065A3");
          text.name = "mytext";
          text.textAlign = "left";
          text.lineHeight = 37;
          text.lineWidth = 372;
          text.setTransform(153.2,78.7,1.027,1);
  
          container.addChild(text);
  
      }
  
      function convertToDomElement(){
          $("#demoCanvas").css({width:"700px"});
  
          var object = container.getChildByName("mytext");
  
          // create new domElement
         var  newInput = $("&lt;input&gt;", {type: "text", val: object.text});
          $(newInput).css({"width": object.lineWidth +"px","font": object.font,"color":object.color,"position":"absolute","top":"0","left":"0","z-index":99,"border":"1px solid black","display":"block","visibility":"hidden","outline":"none","background-color":"red", "border":"0"})
       $(newInput).appendTo($("#wrapper"));            
           // create new domElement wrapper
          inputElement = new createjs.DOMElement(newInput[0]);
          inputElement.name = object.name+"input";
  
           // set htmlelement value
          inputElement.htmlElement.value = object.text
  
      inputElement.setTransform(object.x, object.y, object.scaleX, object.scaleY, object.rotation, object.skewX, object.skewY, object.regX, object.regY);
          container.addChild(inputElement);
  
      }
  
      function tick(event) {
  
          stage.update(event);
      }
  
  &lt;/script&gt;
  </code></pre>
  
  <p>
      
      
      
      
  </p>
  
  <p>Hope someone can help me with this.</p>