hi!
i am trying to make ajax page change with jQuery address plugin (http://www.asual.com/jquery/address/) and it works fine. you can see working example of that technique here: http://www.feeldubrovnik.com.
i wanted to add some page transition animations with GSAP, so i declared timelines outside the function in which i am trying to call them from, but something i did wrong. here's the (simplified) code:
$(function(){
//...
// declaring timeline
var tl_home = new TimelineMax({paused:true});
tl_home.fromTo($("#home_logo"), 1.2, {scale:.2, rotation:45, autoAlpha:0}, {scale:1, rotation:0, autoAlpha:1, ease:Back.easeOut});
tl_home.staggerFrom($(".feature_box"), .8, {scale:.1, autoAlpha:0, ease:Back.easeOut, transformOrigin:"50% 50%"}, 0.2, "-=0.9");
//...
$.address.change(function(event) {
//...
switch(currPage.name) {
case 'home':
// calling timeline within function
tl_home.play();
break;
case 'about':
tl_about.play();
break;
}
//...
});
});
i think that it has some scope issue, but i can't figure it.
when i declare timelines within 'switch' it works just fine.
please tell me what am i doing wrong.
tnx in advance.