Jump to content
GreenSock

Search In
  • More options...
Find results that contain...
Find results in...

Search the Community

Showing results for tags 'JS'.

  • Search By Tags

    Type tags separated by commas.
  • Search By Author

Content Type


Forums

  • GreenSock Forums
    • GSAP
    • Banner Animation
    • Jobs & Freelance
  • Flash / ActionScript Archive
    • GSAP (Flash)
    • Loading (Flash)
    • TransformManager (Flash)

Product Groups

  • Club GreenSock
  • TransformManager
  • Supercharge

Categories

There are no results to display.


Find results in...

Find results that contain...


Date Created

  • Start

    End


Last Updated

  • Start

    End


Filter by number of...

Joined

  • Start

    End


Group


Personal Website


Twitter


CodePen


Company Website


Location


Interests

  1. Hello, I've got an animation of some objects looping through a bezier using the BezierPlugin. I want to fire a function to make the objects stop with an ease, wherever they are but along the bezier curve. Imagine a racetrack and there's suddenly a red flag, all the cars need to come to a halt all of a sudden. How would I go about that? I tried overwriting the tween but it just stops. Another question as well on how the bezier the plugin draws, how can I make it not start drawing the bezier from x:0 y:0. Say I want it to start on the middle of the stage instead. Thanks!
  2. I'd like to pause my timeline at a particular point. How do I do this? This is the code I have so far. http://hastebin.com/soqelufado.pl The code repeats, but I'd like to pause it before it repeats. I figure that I should do this my providing a parameter to the final tween, which currently looks like this: . to( $(els).eq(2), 2, { left: 0, delay : 3 } ) So, how do I make this tween pause after it runs? Also, if I'm right, and there is documentation for this. where is it? Thanks.
  3. On all browsers I'm getting a Uncaught TypeError: Cannot read property 'style' of null This is the culprit: v = function(t, e) { var s, r, n, a = t.style; Uncaught TypeError: Cannot read property 'style' of null if (void 0 === a[e]) { for (n = ["O", "Moz", "ms", "Ms", "Webkit"], r = 5, s = e.charAt(0).toUpperCase() + e.substr(1); --r > -1 && void 0 === a[n[r] + s]; ) ; if (0 > r) return ""; i = 3 === r ? "ms" : n[r], e = i + s } return e } It's all obfuscated so I'm not too sure what's going on here. Why that function is even running on load when
  4. First of all I would like to thank you for creating GSAP for JS its simply Amazing! I was checking out : http://www.greensock.com/customease/ and thought it would be amazing to be able to do something like that in JS/HTML5, so I thought I'll ask. Mate it may sound a little off-topic but is there a way to maybe draw such a bezier curve in HTML5/Javascript? I want to ask a a animate an object along the bezier path. Is it possible to maybe do something like this, where user can edit the bezier curve? I hope I make sense, please pardon me if I don't as I am pretty new to JS/jQuery.
  5. I've been having an issue using TweenMax and setting the css properties of an element. It seems to be automatically picking out a z-index and applying it to the style of the element. I'm assuming this is something that was added as a quick fix for performance or css3 animation flickering as backface-visibility is also added without me requesting it (which is a whole different issue and really bogs down performance on iOS Safari). The code is: TweenMax.set(element, {css:{y:0}}); This ends up being: <div class="header" style="z-index: 0; -webkit-backface-visibility: hidden; -web
  6. Simple HTML5 example that tweens embedded SVG graphics. tween_svg_example.zip <embed id="svgBoard" src="board.svg" type="image/svg+xml" style="position:absolute; left:0px; top:0px; width:727px; height:501px;" /> <embed id="svgPeopleRight" src="people_right.svg" type="image/svg+xml" style="position:absolute; left:0px; top:0px; width:727px; height:501px;" /> <embed id="svgPeopleLeft" src="people_left.svg" type="image/svg+xml" style="position:absolute; left:0px; top:0px; width:727px; height:501px;" /> <embed id="svgText" src="text.svg" type="image/svg+xml" style="positio
  7. Hello again, I'm now moving on to the menu. How do I setup the menu (styled it etc..), so what I want is that once you click on a menubutton it auto scrolls down to that page/section. And my question is. How do I do that? Because when I look at the demo of this I don't see any demo with an actual functioning menu. There is a lot about effects and animations, but nothing in it about how to make all of that work with a navigation also. Does anyone got some kind of tutorial on 'How to make a menu that scroll to page/section'? Maybe there is a tutorial somewhere that I have missed?
  8. Hi, Since the introduction of animation in JS, ad management programs are changing the standard of Flash to JS when it comes to advertisement. But they keep the same restrictions on KB. When I was given the task to make a banner in JS, Greensock immediately popped up in my head. I've looked at the download page and when customising the library I saw 7 kb when only selecting Tweenlite. As shown here: But when I look on my mac when inspecting the file: Am I doing something wrong downloading or am I missing something here? For the banner to be accepted @ the ad networ
  9. Hello there again! I use TweenMax.set() to set properties like opacity and transform(x,y,rotate,scale(x,y)) for IE6-8, and it works like charm, everything is perfect! But I have one issues, which I don't know how to solve. The life cycle of my page: Set DOM values via MVC engine Wait until $(window).load() and then fadeIn() page Problem is TweenMax.set() executes on slow computers after load is complete and then user needs to wait like 2-3 seconds until element by element is positioned for him. Basically it look like mess. What I would want is to know when TweenMax actually sets t
  10. Hi there, and thank you for these fine greensock tween engines. Can't imagine how many flash banners I've made importing that com.greensock package. So let's cut to the chase, I've started using greensock for html-banners as well and ran through a problem. TweenLite onComplete triggers right away. I've searched the forums and all but didn't find anything on this. Here's the (stripped) code that's not working: function init() { TweenLite.to('#frame1', .3, {opacity: 1, delay: 0, onComplete: arrowLoop, onCompleteParams:[arrow1]}) TweenLite.from('#arrow2', .3, {opacity: 0, top:"-=10
  11. When tweening a CSS property, once the tween is complete it seems the property is removed. How can I make the CSS property that was tweened persist?
  12. Reporting a bug here. On IE8 my animation complete kills the experience, throwing a runtime error popup. Works fine though on Chrome and proper browsers. I'm doing the following: animateInBars : function(callOnComplete){TweenMax.staggerFrom( dom_element.find('.barchart-bar'), 0.5,{height:"0%", ease:Elastic.easeOut}, 0.01, callOnComplete);}, The animation works fine, but when the onCompleteAll kicks in, it crashes. IE8 throws this at me: Object expected TweenMax.js, line 308 character 7 That corresponds to this code on line: onCompleteAll.apply(onCompleteAllScope, onCompleteAllParam
  13. I was wondering about the best way to handle a jQuery resize event when a user resizes the browser window. I am using TimelineMax and currently I am pausing the timeline, moving it to the very start of the timeline and then removing the timeline object, initializing a new one and rebuilding the timeline each time the browser resize event is fired. I was thinking there might be a better way to do this. I found this answer on StackOverflow here. Having said that, this solution works, but it moves the timeline to the start every time. If I try and resize the window and pause the timeline at
  14. Hi friends, In my document I am doing this: <script type="text/javascript" src="js/greensock/plugins/CSSPlugin.min.js"></script> <script type="text/javascript" src="js/greensock/TweenLite.min.js"></script> I would like to know if is it possible to load GSAP library from an absolut url. somethin as: <script type="text/javascript" src="http://greenshock.com/js/greensock/plugins/CSSPlugin.min.js"></script> Thanks
  15. Hello, I love GreenSock, it's a phenomenal product. I am a Flash Developer migrating to HTML, Canvas, CSS, and Javascript web designing. The Javascript versions are excellent. The one challenge I am having is trying to make the CSS 3D Transformations work. I looked at the demos of how powerful these transformations can be at: http://www.greensock.com/transitions/ http://www.greensock.com/css3/ and the "CssPlugin" section of your documentation at: http://api.greensock.com/js/ But, unfortunately I see a whole lot of small snippets of code (i.e. the trailer for a reall
  16. Hello, I've been working with the Javascript version of GreenSock v 12, EaselJs, and the Canvas element. I know that the Actionscript version of Greensock has a CircluarPath2D or something something like that, but I've searched Google and the Greensock forums and cannot find a way of actual animate the drawing of a shape like in Flash. I've seen tons of examples on "Transforming" shapes, and the drawing of shapes and then put them on the screen, but not any actual on-screen animated drawing of a shape/bezier. I also, looked into svg, but did not see an option there. Is it possibl
  17. This is probably an edge case so it's not a huge deal, but thought I would report this as I spent the past few hours figuring it out... My PhoneGap (Cordova) iPad app allows orientation changing in all four directions. 1 = home button bottom 2 = home button top 3 = home button right 4 = home button left For each orientation I use GSAP to rotate an element so that the top of that element always points to the home button. This worked in all variations except when rotating from 3 or 4 to 1. When rotating to orientation 1 I was using rotation:0 Changing rotation:0 to rotation:
  18. As a Flash Developer coming into Canvas, I'm loving GSAP. But I was amazed how slow it was just tweening the color of a EaselJS object. Experiment tweening alpha and scale: http://antoniobrandao.com/canvas/ Experiment like the above, but also tweening the "tint" of an easelJS Shape http://antoniobranda...vas/index2.html It completely destroys it!!! Am I doing it wrong or is this just slow? Check the source code in the experiments. Any help appreciated!
  19. I'm having an issue with Animating alpha PNGs in TweenMax JS in IE8, there is a lot of distortion during the animation but after it is complete the PNGs return to a normal state. I know IE8 inherently has issues with PNGs but is there a work around for this in TweenMax?
  20. I'm new to JS/CSS (coming from AS3) -- I wonder if someone could help me figure out the following: I'd like to have tabs at the bottom of a page which, when rolled over (or clicked) slide up. The tabs will contain images of 45px height. I'd like, say, the extended tab to be something like 100px in height. I gather this has something to do with overflow, hidden, auto, etc -- I've seen solutions using jQuery slide, but I'm not sure how to do it with Greensock -- that is, I am well-versed in the GS engines, but putting it all together (CSS, DIVs, overflows, etc) is throwing me.
  21. Alan

    bezier in javascript

    Hi, I wonder if we will have bezier support in javascript version soon? I had a great success with greensock and easelJs together, I can almost 100% duplicate what I have done with actionscript 3 before, apart from bezier curve animation...
  22. Hi, Experimenting with js version. I wonder if there is a js version of overwrite manager? I am having weird behavior sometimes. And right now i guess we should not use tweenlite/max for production. ?
  23. Berry

    IE issue

    I am new to both Jquery and TweenMax but so far I love using TweenMax js. I took the code from http://www.snorkl.tv...script-preview/ exploding bunnies example and tweaked it a bit to get a effect of multiple rain drops falling on the screen. It looks good in firefox, chrome and safari but in ie 7 and 8 (I don't currently have access to ie 9) it is not displaying correctly. There is only 1 rain drop displaying and it is grey instead of the white png. Also I have it paused when loaded and have a click event to play the tween but it is playing upon load. Any ideas of what I am doing wrong?
  24. Hi Jack, Just wondering if you had any plans on creating a JS equivalent to TransformManager in addition to the newly released Tween library. Thanks!
×