Jump to content
Search Community

TehThird

Members
  • Posts

    6
  • Joined

  • Last visited

TehThird's Achievements

3

Reputation

  1. Thanks for the reply, but can you be more specific? Im not a pro in this, just learning. But would really want to know what you mean by installing the definitions.
  2. Amazing, thanks. So happy for this.
  3. Started experimenting with this again and but made a github this time with an angular 2 quickstart wich i made with the angular-cli: https://github.com/ekstremedia/eks-app Working demo with gsap and bootstrap 4. Will work more on it later. But in this app I need to do: declare var ease, TimelineMax,TweenMax,Power4,Power1,Power2,Power3,Bounce, Elastic:any; On the components where i will use gsap to make compiler happy.. and im not sure if my solution is good but im open for tips!
  4. After some more fiddling i made it work in Angular2. I had a ts-file loading the js. files into a html index template and i removed the gsap js files from there to just inside the index.html and then it worked, thanks to OLUBLAKE's input. Thank you for the plunker, i missed the console.log's and then understood that it actually worked. Here is a modified version with visual animation: http://plnkr.co/edit/jpbljE?p=preview of a working greensock angular2 app.
  5. Hey Carl and thanks, and thank you OSUBlake. I tried your code, but still cant get any animations. I tried this: import {Component} from 'angular2/core'; import "gsap"; @Component({ selector: 'opning', templateUrl: './components/opning/opning.html', styleUrls: ['./components/opning/opning.css'] }) export class OpenCmp { constructor() { var tl = new TimelineMax({ delay: 1 }); var logo = $('#logo') tl.from(logo, 1, { x: -200, scale: 0.1 }, 0.7); tl.play(); console.log('played'); } } In compiler i get this error msg: error TS2304: Cannot find name 'TimelineMax'. Do I have to declare tl in any other way? I have included TimelineMax.min.js and TweenLite.min.js I also dont see animation on the plunker, tried to fiddle with it with no luck too.
  6. Hey, I've wondered on how you can use GSAP with Angular2 if anyone here have done that. I loaded the TimelineMax.min.js in my main index.html-file, but having problem importing it into a component. My component look like this: import {Component} from 'angular2/core'; //import {TweenLite} from 'gsap/src/minified/TweenLite.min.js'; //import {TimelineMax} from 'gsap/src/minified/TimelineMax.min.js'; //import {TL} from 'gsap/src/minified/TimelineMax'; import {TL} from 'gsap/src/uncompressed/timelinemax'; @Component({ selector: 'opning', templateUrl: './components/opning/opning.html', styleUrls: ['./components/opning/opning.css'] }) export class OpenCmp { constructor() { console.log("played"); console.log(TL); // console.log(TweenLite); // var tl = new TimelineMax(); /*var logo = $("#logo"); tl.from(logo, 4, { z: 500, y: 74, visibility: "visible" }); //tl.from(logo, 2, { left: "632px" }); tl.play(); */ } } I installed gsap with npm install gsap so it is in my projects /node_modules/ . Have tried several approaches, but i can not set tl = New TimelineMax() in that typescript class and I dont know how to load\import it. Anyone done this with angular2 ? I used this as my starting point: https://github.com/mgechev/angular2-seed
×
×
  • Create New...