cant get TimelineLite to work

[mi32dogs]

Hi,

 

I'm building some HTML5 banners, and i normal use TweenMax and TimelineMax and that works fine, now i have a banner and i need to make it a little smaller to fit in the 150K Google size, so i thought i use Tweenlite, TimelineLite and easingpack as the annimation is very easy but i cant get it to work.

 

this is the JS script

window.onload = function() {


	var tl = new TimelineLite();
	tl.timeScale(.8)
    
	
	// Slide in Quote 1
	tl.from("#quote1", .6, {x:300, ease: Power2.easeOut});
	
	// Quote 1 to quote2
	tl.to("#quote1", .8, {scaleY:4,scaleX:4, y:-500, opacity:0}, "+=2");
	tl.from("#quote2", .8, {scaleY:0,scaleX:0}, "-=.8");
	tl.to("#bg-blue", .8, {opacity:0}, "-=.8");
	
	//slide in the background
	tl.from("#bg-left", .8, {x:-150}, "+=2");
	tl.from("#bg-right", .8, {x:150}, "-=.8");

	//zoom in logo
	tl.from("#logo", .8, {scaleY:0,scaleX:0});
	
	// fade idina in
	tl.from("#idina", 1.5, {opacity:0, ease: Power2.easeOut});
	
	// Add overlay
	tl.from("#overlay", 2, {opacity:0, ease: Power2.easeOut}, "-=.5");
	
	
	// slide in date, theatre and get
	tl.from("#date", .8, {y:50, opacity:0, ease: Power2.easeIn}, "-=2");
	tl.from("#theatre", .8, {y:-50,opacity:0, ease: Power2.easeIn}, "-=2");	
	tl.from("#buttonbg", .8, {opacity:0, ease: Power2.easeIn}, "-=1" );	
	
	// Fadein quote3
	tl.from("#quote3", .8, {opacity:0, ease: Power2.easeIn} );	
	
	TweenLite.set("#stage", {visibility:"visible"});
	
}

and i include the following js scripts

TweenLite.min.js
TimelineLite.min.js
EasePack.min.js

 

the animation is not running and it is not giving me any errors so i have no clue what is wrong.

 

any idea's

 

Thanks,

Rob

 

[ohem]

You need to include CSS Plugin in addition to TweenLite & Ease Pack.

[mi32dogs]

Yes that was it it is working now thank you so much