Jump to content
Search Community

Thomas James Thorstensson

Members

  • Posts

    71

  • Joined

  • Last visited

 Content Type 

Everything posted by Thomas James Thorstensson

1
2
3
Page 2 of 3  
  1. Thomas James Thorstensson
    Hello I have an animation where text, Source Sans Pro, is moving downwards as it fades in. It works fine now but just wondering why. In latest version of Firefox, if I add this the animation is smooth: -webkit-filter: grayscale(0%); filter: grayscale(0%); If I remove the above, the text moves in a jerky fashion. I used this "fix" before, and it always sorts Firefox out. But now I just wonder Why? Thanks!
  2. Thomas James Thorstensson
    Hello There , Swedish London based Rich Media Banner Developer & Designer, with over a decade of experience of building banners for a wide range of clients. Canvas or no canvas? No problem. Greensock or Pixie? Can do. Story-boarding needed? Yes. Video? You bet! Interactive Javascript or image slider? Consider it done! Can work over Zeplin or WeTransfer, whatever you prefer. A codepen sample of my work: https://codepen.io/ThomasJames/pen/RXQrzp Some of the companies I worked with: WWF, Wunderman Ogilvy Gamesys, TBWA\Copenhagen, MRM Meteorite, McCann, The Two Marias, NKD Learning, DOOH, York Press, TAG Worldwide Ad banner platforms I work with: Google Studio, Google Campaign Manager, Flashtalking, Celtra, Sizmek, Adform, Admeto, +Yours (Send me the specs!) Contact me at hello@thomasthorstensson.co.uk for more samples of recent work and a discussion of what you need done!
  3. Thomas James Thorstensson
    Jonathan Thanks for your reply. I managed to get it working, it turns out that it was the rotation:0.01, which actually was not working in this case but causing the animation to jitter in the end. So I dropped that and tested in Opera, Chrome, IE and Firefox (ugh). Thanks for all your hard work!
  4. Thomas James Thorstensson
    I think I somehow managed to reply as another person, sorry! So, I decided not to worry about it so case closed. Thanks everyone! Former IE11 user, S?
  5. Thomas James Thorstensson
    I thank you all for the kind offer of help. IE11, prepare to get sacked! S.
  6. Thomas James Thorstensson
    Hi I think I solved this issue a year ago but can't find the css I added. When I slide some text down using y: property, and the text is Open Sans, but happens with other font too: then before it comes to halt it wobbles, but only in IE11. I have rotation 0.01 tip on there, and tried defaultForce3d true, but there was something else I did that fixed this, something in CSS. My css by the the way has backface visilibity hidden but that won't affect IE11. There was something else I did with aliasing, cutting into the font to get it to work, somehing weird with lots of channels and 0, 0, 0, 0 values but cant remember what it was. If any ideas, feel free to post!
  7. Thomas James Thorstensson
    Thanks Jonathan, Great work on this library. That explains it, and I now feel a bit more confident as I drink my Espresso. Soon I will take my Greensock skills and move from London to Barcelona this autumn, where I will tell people to use Greensock of course Cordialmente Thomas
  8. Thomas James Thorstensson
    Hi I revisited an old html project of mine where I am using TimelineMax and CSSPlugin. Am I right in saying that I no longer need to rely on CSSPlugin with TimelineMax since for example with TweenMax we can now animate css properties directly? If I no longer need CSSPlugin, is there a away from TimelinMax to do the old trick: CSSPlugin.defaultForce3D = true; Thanks in advance, Thomas
  9. Thomas James Thorstensson
    I can answer this one myself. That methodology worked fine.
  10. Thomas James Thorstensson
    Hello Yup thats right its back to the days of Flash for me. Flash and chocolate cookies: I'm using VideoLoader in a service class. Once the video loaded I wan to add the video tot he display list in a different class (It's a robotleg project). Now I guess I could in my service class create a container sprite and in my initialization include it without adding that container to stage and then once the video is loaded I pass that container as payload via my event to > mediator > to my Video view where I add it to stage. Or is there another way? I base this question on the fact that you usually include a container : //create a VideoLoader var video:VideoLoader = new VideoLoader("assets/video.flv", {name:"myVideo", container:this, width:400, height:300, scaleMode:"proportionalInside", bgColor:0x000000, autoPlay:false, volume:0, requireWithRoot:this.root, estimatedBytes:75000}); //start loading video.load(); Snoop, ".S"
  11. Thomas James Thorstensson
    Hello Fellow Greensockers, Here is a question for you How come that, when trying to create an instance of TimelineLite after that the javascript onload event fired, the following import gives me this error in Chrome:Uncaught ReferenceError: TimelineLite is not defined(…) <script type="text/javascript" src="https://s0.2mdn.net/ads/studio/cached_libs/cssplugin_1.19.0_cfbff7d208ccfdbe176b9855af1eb1fa_min.js"> </script> <script type="text/javascript" src="https://s0.2mdn.net/ads/studio/cached_libs/tweenlite_1.19.0_422f021fad4c20f20cf3640a06ac39e9_min.js"></script> Whereas this import does not <script type="text/javascript" src="https://s0.2mdn.net/ads/studio/cached_libs/cssplugin_1.19.0_cfbff7d208ccfdbe176b9855af1eb1fa_min.js"> </script> <script type="text/javascript" src="https://s0.2mdn.net/ads/studio/cached_libs/tweenmax_1.19.0_643d6911392a3398cb1607993edabfa7_min.js"></script> Did my brain just die overnight ? Sorry, it is such a silly question. But as I recall I just need to import TweenLite to instantiate TimelineLite Thanks in advance, "S"
  12. Thomas James Thorstensson
    Hello, the below works, loading TweenMax from CDN <script src="https://s0.2mdn.net/ads/studio/cached_libs/tweenmax_1.19.0_643d6911392a3398cb1607993edabfa7_min.js"></script><script src="https://s0.2mdn.net/ads/studio/cached_libs/cssplugin_1.18.5_6bbddbd910e8bfac4e19220fe52e1af6_min.js"></script> function initAnim() { var TL = new TimelineLite(); TL.from("#banner", 1.2, { autoAlpha: 0 }); TL.to("#car", 2, { x: 200, y: 200 }) } But the following does not work, it tells me that TimelineLite is not defined, loading TweenLite from CDN <script src="https://s0.2mdn.net/ads/studio/cached_libs/tweenlite_1.19.0_422f021fad4c20f20cf3640a06ac39e9_min.js"></script> <script src="https://s0.2mdn.net/ads/studio/cached_libs/cssplugin_1.18.5_6bbddbd910e8bfac4e19220fe52e1af6_min.js"></script> function initAnim() { var TL = new TimelineLite(); TL.from("#banner", 1.2, { autoAlpha: 0 }); TL.to("#car", 2, { x: 200, y: 200 }) } I am perplexed. I am sure this worked before. Since I am only creating an instance of TimelineLite, i should not need to load TweenMax. Hmm. What on earth. Thankful for insights, ".S"
  13. Thomas James Thorstensson
    Hello fellow Greensocker. I recommend asking this question on StackOverflow as well. But here is a simple way of doing it. Note that setting an the source of the Image object kicks things off. Also, if you are doing banners you might run into DoubleClick. Albeit their default template code speaks of loading the Enabler does not preload images. So even if you are doing doubleclick banners: if you need to preload images you can bake the code below into the default logic of any doubleclick template javascript file. There are also other ways to preload, see stackoverflow. var imagePreloadCount = 0, imagesToPreload = [ 'image.jpg', 'anotherimage.png' ]; function preloadImages() { for (var i = 0; i < imagesToPreload.length; i++) { var thisImage = new Image(); thisImage.src = imagesToPreload[i]; thisImage.onLoad = imageLoaded(); } } function imageLoaded() { imagePreloadCount += 1; if (imagePreloadCount == imagesToPreload.length) { startMyAnimation() } } preloadImages(); Thanks, ".Snoop"
  14. Thomas James Thorstensson
    This was a good explanation.; I now know what I did not know before and shall try it in my CSS animations. Thanks, I am closing this now, as a fellow green-socker ".S"
  15. Thomas James Thorstensson
    Thanks, you Snoop got it figured. I also can report in, that using staggerTo or staggerFrom instead and just feeding it an array more or less allowed for the same effect, without the rendering issues. And I would like to come with a suggestion, towards the end of this report. Since the rotation:0.01 trick is so common, to make things run faster in some browsers, and seeing that it works, it would be great if there could be a global setter or something where you could just globally on all elements set rotation 0.01. (Seeing as It is often a good fix). Many Thanks and I shall now close this post. Until next time, ".S"
  16. Thomas James Thorstensson
    Wut wut wut. That is handy. And hmm will that then apply hmm to TimelineLite as well? Thanks "S."
  17. Thomas James Thorstensson
    Is there a simple way with TweenLite, to disable all ease? Or rather does TweenLite have a built i default ease, such as Linear or other? - that I can disable. Thanks ".S"
  18. Thomas James Thorstensson
    Initial self report and findings: Removing all easing equations improved rendering quite a bit ".S"
  19. Thomas James Thorstensson
    Hello Fellow Greensocks, I've noticed some artifacts when I animate text using SplitText library. See screenshot below I wonder, can anything be done to solve this in IE11 for example? I will test adding rotation 0.01 trick, but not sure if it will help. Any ideas? Thanks for anotherwise excellent product, Let the socks be green! ."S"
  20. Thomas James Thorstensson
    Thanks to all that replied and thanks Mr Jonathan. Yes I went down the route of using minfied versions of the CSSPlugin and TweenLite and that seems to be the best option So, I have marked this as solved! See you around, Greensocks Snoop,
  21. Thomas James Thorstensson
    Hello Fellow Greensocks! Just finished some iPad banners and been told I need to not use CDN but have the Greensock locally. Questions: From the download page, what is the most minimal way to download? After download, is there some other "trick" to make it even more minimal? Until next time, Snoop,
  22. Thomas James Thorstensson
    Thankyou Mr Jonathan for your answer. I think it suffices for me. I was along the line that, as you say, 'starting two animations should not matter', and so, I will examine the code and see what I can learn by simple research. It will be fun to try some ideas in the office. It is not an essential question as the animation is relatively smooth. But, one always strives to do better. In this case I shall rest my case and do the rest of the legwork myself. As the hour is late and I am back from office and yet to eat, I bid you farewell. Until next time ".S"
  23. Thomas James Thorstensson
    Hello, I noticed that when I chain animations with .to , sometimes if two animations start at the same time, there can be a slight jerk in the animation, even if I do the rotate:0.01 trick for Firefox, etc. Question, is it perhaps 'smoother' or 'faster' rendering wise, to in those cases create multiple instances of TimelineLite, for example two instances, to ease the stress that one instance carries when starting two animations at a simultaneous time index. I'm not including any code since I trust the question is a simple one, since it is simple to start to animations the same time by just giving them that time index at the end of the to. (object, time, {property: value}, 'timeindex') Snoop out
  24. Thomas James Thorstensson
    Hello Carl, Snoop here. Yippii. This answers what I was trying to do Seeing clearly now again! It seems to me I can just use repeat on some little something with 0 time just to set it to tween max. And then go about my business!!! Thanks. See you around. .s
  25. Thomas James Thorstensson
    Hello Albeit I thank you for the links I have them already as I used greensock since the days this site was created:) My confusion is only regarding specific topics. I only have one question, so if you instead could adress that please. I only wondered if there is some flag that you can set so that instead of as below (which is from the api documentation), .to by default will add a TweenMax instance. I am chainging many things with to but some of the things I am doing require TweenMax. So my question again then as it is simple. The below is from the documentation. And I wonder if it as said above could Add a TweenMax.to() instead. .to( target:Object, duration:Number, vars:Object, position:* ) : * Adds a TweenLite.to() tween to the end of the timeline (or elsewhere using the "position" parameter) - this is a convenience method that accomplishes exactly the same thing as add( TweenLite.to(...) ) but with less code. Thanks, .t
1
2
3
Page 2 of 3  
×
×
  • Create New...