A Pen by A Non Ymous.

Basic-Tween.markdown

Basic Tween

Source for: http://www.greensock.com/jump-start-js/#

A Pen by Secret Sam on CodePen.

License.

index.html

<div id="demo">
  <div id="text">test</div>
</div>

script.js

/*external js
http://cdnjs.cloudflare.com/ajax/libs/gsap/latest/TweenLite.min.js
http://cdnjs.cloudflare.com/ajax/libs/gsap/latest/plugins/CSSPlugin.min.js
*/

window.onload = function(){
  var text = document.getElementById("text");
  /*
  METHOD 1: no force3D
  This gives "jumpy letters"
  (tested in chrome v33 on windows 8.1 
  */
  TweenLite.to(text, 1, {scale:5});
  
  /* 
  METHOD 2: force3d
  
  This currently scales from 1 to 5 which causes
  unsharp text (because of gpu scaling), but this
  could be solved by going from 0.2 -> 1, however
  this is not relevant for this demo
  
  */
  //TweenLite.to(text, 1, {scale:5, force3D:true});
}

//run
//PC ctnrl-0
//MAC cmd-0

style.css

body{
	background-color:#000;
 color:white;
}
#demo {
	width: 692px;
	height: 600px;
	background-color: #333;
	padding: 8px;
}
#text {
	font-size:50px;
  position:absolute;
  left:200px;
  top:50px;
}