Jump to content
Search Community

WombatTurkey

Members
  • Posts

    3
  • Joined

  • Last visited

WombatTurkey's Achievements

0

Reputation

  1. Hey guys, As you know from my previous thread here (http://greensock.com/forums/topic/12570-screen-tearing-with-tween-if-css-animations-are-in-effect/) I am wanting to use greensocket for a couple animations within my game. My game will be free and users don't have to pay anything to gain access to anything. But, I am going to have a microtransaction shop where users can buy cosmetic items like weapons, armor, etc. So would I still need to purchase the license?
  2. Hey Diaco, thanks! I found the issue, it's whenever an element in the gameworld was changing opacity, be it tweened from greensock, or a basic opacity animation keyframe using css. It would lag and drop all frames. I fixed it by using: .fadeOut { visibility: hidden; opacity: 0; transition: visibility 0s 2s, opacity 2s linear; } Looks like transitioning it was faster than tweening the opacity, or a css animation.. And this method doesn't make my game lose any frames... just really weird. Thanks for ur help though. Marked as resolved Edit: I narrowed down my problem and it was the fading out of the elements that was causing screen tear, not the screen flip animation. Forgot to tell you
  3. Hey guys! So basically I want to switch to greensock and use Javascript animation for my web browser game. I've heard Javascript has better performance when tweening and doing animations. I'm at the point where there I have a lot of entities and objects on the screen and I really don't want to convert my game into canvas or an html 5 engine (like phaser). It's a basic game and works fine on the dom. Here is an example of movement (mind you, it's usually 60fps, but since I'm recording it dropped it down) I'm using this code for the world movement: TweenLite.to(gameworld, 0.6,{left:'-'+x+"px", ease:Cubic.easeOut}); TweenLite.to(gameworld, 0.6,{top:'-'+y+"px", ease:Cubic.easeOut}); TweenLite.to(gameworld, 0.6,{marginLeft:newMargins[0]+"px", ease:Cubic.easeOut}); TweenLite.to(gameworld, 0.6,{marginTop:newMargins[1]+"px", ease:Cubic.easeOut}); Now, everything is working fine and I love it. It's actually a lot smoother using Javascript especially since my worlds can be over 7000x7000px in dimensions The problem is, if I add ANY type of css transformation on the screen (like a flip in, fadeIn, out effect) it drops drastically (only while moving), like so: See how right after I kill the monster, my screen animation pops up using css transitions and my fps drops in half! (Not good!). So I ask, do I need to convert all my CSS transition's into Tween/Javascript effects to not have that type of lag? It seems mixing css transforms just completely wreck the screen tear
×
×
  • Create New...