Jump to content
GreenSock

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

Wiplash

Members
  • Posts

    15
  • Joined

  • Last visited

Wiplash's Achievements

Newbie

Newbie (1/14)

2

Reputation

  1. I wanted to raise a couple of things that are making HTML banner production a nightmare at the moment. 1. Compatability - Our clients are expecting their banners to work on basically every browser at the moment. In reality we are supporting back to ie9, ie8 shows a backup GIF. This is increasing the file size in the form of not being able to use .svg's and also fonts and fallbacks. As well as massively complicating the build process. 2. Fonts - Has anyone figured out font's yet? There are two option that I have found. Illegally convert a font you don't own the proper licensees for via font squirrel. That is, if the font is not blocked by the site. However due to the above point, you need to include 3 or 4 different font formats. .ttf, eot, woff and possibly and svg font. This can total up to 250k already, before you've even started. Technically according to the font licenses you are not allowed to remove characters from the font to reduce file size either. Apart from the fact converting to the different formats is illegal, as is putting the font on a domain that you do not own. Which is obviously a nightmare for agencies as we don't own any of the sites we put banners on. Dispite the illegality, this appears to be how everyone is doing fonts. The other alternative is to use fonts.com, the only problem being they require a tracking code. I spend 4 days on the phone with Flashtalking sorting out the fact that they do not like any external calls in their ads, but in the end we reached a solution that works on secure sites and normal ones. I lied their is another problem, you have to track page impressions, so for us to use 1 font in a banner getting 12 million impressions, costs us about £500 a month. Which may or may not seem like a lot of money to you. 3. I would love to use css transitions and keyframes to keep animation size down, but problem 1 means it has to work in ie9. The only solution left to use is to use GSAP. So with the font's and TweenMax we are sitting on at least 150k, before even getting nay images or assets in.
  2. Thanks, thats perfect. It's actually for a video scroll and scrub website. Might be having performance issues as it's trying to target frames of the video or times that essentially don't exist. This should help, thanks.
  3. Hi there, Does anyone know how I would apply roundprops to the following tween?, I can't figure it out. tl.tweenFromTo(tl.time(), tl.getLabelBefore(), {onComplete: function(){allowScroll = true;}}); Thanks
  4. Worked it out. Turns out if I'm now tweening the X and Y I don't need to know where it's and and y was before. function startP2Jiggle (){ // alert("startjiggle"); for(i=1; i <= p2_letters; i++) { var jigTarget = document.getElementById("p2_letter_" + i); moveToRandom(jigTarget); } } function moveToRandom (target) { var randXshift = getRandomArbitary(-5, 5); var randYshift = getRandomArbitary(-5, 5); var randTime = getRandomArbitary(0.5, 2); TweenMax.to(target, randTime, { x: randXshift, y: randYshift, ease:Quad.easeInOut, force3D:true, onComplete: moveToRandom, onCompleteParams:[target]}); } That's a nice little jiggle function if anyone wants it x
  5. Thanks for the answers, I have implemented it and can tell it is looking smoother already, but now I have another problem. All my startX and startY positions are now completely off. function startP2Jiggle (){ for(i=1; i <= p2_letters; i++) { var jigTarget = document.getElementById("p2_letter_" + i); var jigX = jigTarget.offsetLeft; var jigY = jigTarget.offsetTop; moveToRandom(jigTarget, jigX, jigY); } } function moveToRandom (target, startX, startY) { //alert(target + " " + startX + " " + startY); var randXshift = startX + getRandomArbitary(-5, 5); var randYshift = startY + getRandomArbitary(-5, 5); var randTime = getRandomArbitary(0.5, 2); //TweenMax.to(target, randTime, {left: randXshift, top: randYshift, ease:Quad.easeInOut, force3D:true, onComplete: moveToRandom, onCompleteParams:[target, startX, startY]}); TweenMax.to(target, randTime, { x: randXshift, y: randYshift, ease:Quad.easeInOut, force3D:true, onComplete: moveToRandom, onCompleteParams:[target, startX, startY]}); } As you can see above in the function startP2Jiggle I'm sending the offsetLeft and offsetTop to moveToRandom. How do I go about changing these to get the x and y instead? Thanks
  6. Hi, Firstly sorry, I know this has been asked before but I have tried to use force3d and it hasn't fixed the issue. I have some code that makes an image jiggle, it just slowly wobbles on screen. The problem is the browser seems to be rounding off the pixels and creating this jerky motion. Has anyone found a solution to this. Here's my code:- function moveToRandom (target, startX, startY) { //alert(target + " " + startX + " " + startY); var randXshift = startX + getRandomArbitary(-5, 5); var randYshift = startY + getRandomArbitary(-5, 5); var randTime = getRandomArbitary(0.5, 2); TweenMax.to(target, randTime, {left: randXshift, top: randYshift, ease:Quad.easeInOut, force3D:true, onComplete: moveToRandom, onCompleteParams:[target, startX, startY]}); } Thanks a lot Will
  7. Wow .. thanks so much. Nice to know i'm not going crazy. All working fine now.
  8. Does anyone have a basic fla with this working .. as2 flash 8 so I can see what I'm doing wrong? Thanks for your help
  9. Hi there, I am having an absolute nightmare trying to get the dropShadowFilter working. I have no idea why it isn't as every other filter works on the same object. Do I need to add a filter first with code before I can animate it? I have the following import com.greensock.*; import com.greensock.easing.*; import com.greensock.plugins.*; TweenPlugin.activate([DropShadowFilterPlugin]); TweenMax.to(mc, 1, {dropShadowFilter:{color:0xff0000, alpha:1, blurX:12, blurY:12, distance:12}}); I have a movieclip named mc and all the setting are the defaults from the plug-in explorer. dropShadowplugin is definately inside my greensock folder. Using greensock 12. P.s. Everything is AS2. Please help. Will
  10. Right then I have my solution. This is basically a culmination of the above but for anyone who wants to know how to do this with the 'members only' dynamic props plugin here it is. It works really nicely. // Imports import com.greensock.*; import com.greensock.easing.*; import com.greensock.plugins.*; TweenPlugin.activate([DynamicPropsPlugin]); // Variables var speed:Number = 2; // Set up a listener var mouseListener:Object = new Object(); // Onmouse move listener mouseListener.onMouseMove = function() { TweenLite.to(mc, speed, {dynamicProps:{_x:getMouseX, _y:getMouseY}}); } // Get X and Y function getMouseX():Number { return _root._xmouse; } function getMouseY():Number { return _root._ymouse; } // Set listener Mouse.addListener(mouseListener); Hope this help someone. Will
  11. Thanks for that. I think maybe it's jerky because I'm on a mac or something and I'm trying to tween two things in this way on top of each other, but even your one is a little on the jerky side on my machine. It may also be that i'm using as2 where yours is as3. I'm determined to find a solution to this problem but thanks for all your help.
  12. Is this not a potential plugin as the dynamic props one is so close to this really? The problem is that the code above creates a very jerky animation. Do you have any other tips such as creating a new tween on an interval or something. I don't need specific code but it just seems to me that this is something everyone needs to do all the time. Any image sliders or ipod style docks need this really to look good. Thanks for your help though. Will
  13. Hi there, I have been looking around this forum for a while now on the subject of continuos tweens but I can't seem to get a definitive answer. I need to create tween that always follows the mouse. I would like if possible to have some easing on this motion also. The dynamic props plug-in is basically perfect for this task except that it has a time limit on it. When my tween reaches the mouse I do not want it to stop the tween but just pause until I move the mouse again I do not however want it to stop and start every time this happens. I guess this could be done with an onMouseMove listener but this is too similar to doing an onEnterFrame function as my mouse will pretty much always be moving. This is something that as far as I'm aware never the right thing to do. Basically a function like this does the job but I believe it is not the best way to do it. onEnterFrame = function(){ TweenLite.to(mc, unlimited, {_x:_xmouse, ease:Quad.easeInOut}); } or onEnterFrame = function(){ mc._x = _xmouse; } Thanks Will P.s. I'm working with AS2
  14. Hello there, I have been trying to get your code to work for over 3 weeks now on and off and I'm really starting to pull my hair out. I tried the code above and it didn't work so I tried to work out what it is I had to do and then implimented it myself but now I get completely unpredictable results. The code I have now is as follows. import com.greensock.*; import com.greensock.easing.* var tl:TimelineMax = new TimelineMax({paused:true}); var startTime:Number = (getTimer() / 1000); var myRoot = this; var genSpeed:Number = 300; var flySpeed:Number = 0.5; var lag:Number = 0.5; var cP:Number = 0; var mouseListener:Object = new Object(); mouseListener.onMouseDown = function() { genParticle(); genTimer = setInterval(genParticle, genSpeed); } mouseListener.onMouseUp = function() { clearInterval(genTimer); } mouseListener.onMouseMove = function() { distanceToFly = Math.floor(Math.sqrt((emitter._x - end_point._x) * (emitter._x - end_point._x) + (emitter._y - end_point._y) * (emitter._y - end_point._y))); flySpeed = distanceToFly / 150 end_point._x = _xmouse; end_point._y = _ymouse; } Mouse.addListener(mouseListener); function genParticle(){ particle_holder.attachMovie("particle", "particle" + cP, cP+1) particle_holder["particle" + cP]._x = emitter._x; particle_holder["particle" + cP]._y = emitter._y; var insertTime:Number = (getTimer() / 1000) - startTime; tl.insert(new TweenMax(particle_holder["particle" + cP], flySpeed, {_x:end_point._x, _y: end_point._y}), insertTime); tl.play(); cP++; } gameOverTimer = setInterval(gameOver, 10000); function gameOver(){ trace("game over"); Mouse.removeListener(mouseListener); clearInterval(genTimer); clearInterval(gameOverTimer); tl.reverse(); } Example http://www.ourtestsite.org/test/particle_test_v2.html Fla to download http://www.ourtestsite.org/test/particle_test_v2.fla I really appreciate your help as once I know this it will help with every other project I do. I also signed up as a paid member after last time because the response was so quick. Thanks again Will
  15. Hi there, Thats absolutely brilliant thank you. It's true I was assuming that insert would add the tween at whatever time had expired already. I'm glad that tweenLite can do this it is as amazing as I had hoped. I'll have to figure out how this goes in my code properly later but initial tests looked good. Thanks again Will http://www.williamjane.com
×